Html:网页制作基础技巧 框架(帧窗口)间的交互

2016-02-19 21:34 19 1 收藏

下面是个超简单的Html:网页制作基础技巧 框架(帧窗口)间的交互教程,图老师小编精心挑选推荐,大家行行好,多给几个赞吧,小编吐血跪求~

【 tulaoshi.com - Web开发 】

  在多窗口的分帧页面中,各分窗口之间的信息交互是经常的事。在导航窗口中点了超级链接,那么如何在另一窗口中打开链接的网页呢?我在这个窗口中按下按钮,能在另一个窗口中写信息吗?窗口那么多,又如何识别窗口呢?请看下面的例子。

  一、在导航窗口点击链接,在另一窗口打开网页

  现有一分帧页面如上图所示的,A窗口是网站Logo及广告,B窗口是导航栏,C是显示页面的窗口。该分帧页面的源代码为:

frameset rows="20%,*" 
frame name="topFrame" scrolling="NO" noresize src="toppage.htm"
frameset cols="18%,*" 
frame name="leftFrame" noresize src="leftpage.htm"
frame name="mainFrame" src="mainpage.htm"
/frameset
/frameset

  若要求在B窗口中的链接页面(test.htm)在C窗口中打开,那么B窗口中的链接应这样写:a herf="test.htm" target="mailFrame"此链接的页面在C窗口中打开/a,在这里起关键作用的是A标记中的target参数,你想在那个窗口中打开网页,就在Target参数中设置那个窗口的名称。

  二、在B窗口中按下一个按钮,在C窗口中写一行字

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

  本例的页面格式与上例相同,完成后的效果是这样的:按下B窗口中“在C窗口写字”的按钮后,在C窗口中就出现一行文字“嗨!你好!这是通过B窗口控制而写的字。”。分帧页面的代码及每个窗口中的网页文件与上例相同。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

  制作方法:

  1、 在C窗口网页(mainpage.htm)的源代码head与/head之间插入下面这段Javascript程序:

script language="Javascript"
!--
function htest(){
document.write("嗨!你好!这是通过B窗口控制而写的字。") 
}
--
/script

  这段程序的作用是在当前窗口写上一段文字。

  2、那么如何在B窗口中调用C窗口中的程序呢?先看B窗口中“在C窗口中写字”这个按钮的源代码:

input type="button" value="在C窗口中写字" onclick="parent.mainFrame.htest()"

  在这段代码中,关键是代码“parent.mainFrame”,这里引入一个新的概念—窗口结构关系,也就是在多窗口页面中,各窗口之间的关系是以什么原则来确定的。窗口关系的确定原则是:当前窗口分割出来的窗口为当前窗口的“子窗口”(children),那么当前窗口就是分割出来窗口的“父窗口”(parent)。如本例中各窗口的关系如下:

  从上表可得知,“浏览器窗口”是“topFrame”和“下部窗口”的“父窗口”,而下部窗口又是“leftFrame”和“mainFrame”两个窗口的“父窗口”。两个窗口之间的联系必须通过它们的父窗口才能进行,所以本例中要调用C窗口中网页上的“htest()”很显然是通过C与B的parent再到mainFrame,然后调用htest()程序。

  那么若C窗口中向B窗口中写字的代码就是这样的了: onclick="parent.leftFrame.htest()";那么,在A窗口中要向C窗口中写一段文字的代码你知道怎样写吗?对了,就是这样:onclick="grandchildren.mainFrame.htest()"。

  从上面的例子中可看出,在各窗口之间进行交互信息,关键的问题是要搞清楚窗口与窗口之间的关系,其它的操作就比较简单了。

来源:http://www.tulaoshi.com/n/20160219/1626528.html

延伸阅读
标签: Web开发
帧是由英文Frame翻译过来的,它可以用来向浏览器窗口中装载多个Html文件。即每个Html文件占据一个帧,而多个帧可以同时显示在同一个浏览器窗口中,它们组成了一个最大的帧,也即是一个包含多个Html文档的Html文件(我称它为主文档)。帧通常的使用方法是在一个帧中放置目录(即可供选择的链接),然后将Html文件显示在另一个帧中。 1.frameset/fra...
  如何利用网页弹出各种形式的窗口,我想大家大多都是知道些的,但那种多种多样的弹出式窗口是怎么搞出来的,我们今天就来学习一下: 1.弹启一个全屏窗口 <html <body onload="window.open('http://www.pconline.com.cn','example01','fullscreen');"; <bwww.e3i5.com</b </body </html 2.弹启一个被F1...
标签: Web开发
由Frames分出来的几个窗口的内容并不是静止不变的,往往一个窗口的内容随着另一个窗口的要求而不断变化,这就提高了Frames的利用价值。为了完成各窗口之间的相互操作,我们必须为每一个窗口起一个名字,这个名字用属性Name来定义。 窗口标识(Frame Name) frame src=url name=“窗口名” 例如: frame src="frame/a.html" na...
标签: Web开发
在用表单设计调查表时,为了减少用户的操作,使用选择框是一个好主意,在HTML的input标记中有两种选择框,即单选框和复选框,两者的区别是单选框中的选项用户只能选择一项,而复选框中的选项用户可以任意选择多项,甚至全选。请看下面的例子: 下面给出这个例子的源代码,结合代码来讲各参数的设置: form name="form1" 你是...
  ■ 框架标记 <FRAMESET <FRAME <NOFRAMES <IFRAME 欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。 也请先明白围堵标记与空标记的分别,请看 【HTML概念】。 ■ 框架概念 : 谓框架便是网页画面分成几个框窗,同时取得多个 URL。只需要 <FRAMESET <FRAME 即可,面所有框架...

经验教程

516

收藏

92
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部