动态高级教程第四节:窗口之间的控制


 

简介

用 JavaScript 很容易用一个窗口来控制另一个窗口中的内容。唯一的要求
是这两个窗口必须有父子关系。也就是说,一个窗口必须是由另外一个窗口
来打开的。 通过这一课,你将会
  • 打开一个窗口
  • 连接主窗口和子窗口
  • 用主窗口来控制子窗口
  • 用子窗口来控制主窗口

打开一个新窗口

你可以 JavaScript 的函数 window.open( ) 来打开一个窗口, 比如

  window.open("adv04_win2.htm", "newWin1");

其中第一个参数是子窗口里的网址。第二个参数是子窗口的名字。另外你还
可以用第三个参数来定义子窗口的性质。 比如

  window.open("adv04_win2.htm", "newWin1", 
	          "toolbar=no,width=700,height=500");

上面一句是打开一个宽 700 高 500 没有工具条的子窗口。

连接主窗口和子窗口

虽然你已经让主窗口打开了一个子窗口,可是它们之间谁也不认识谁。当然
也无法互相控制了。 幸运的是我们可以用 JavaScript 的变量来记住对方或
是说用变量来明确它们之间的父子关系。

现在假定我们主窗口的文件名字叫 adv04_win1.htm, 子窗口的文件名字叫 
adv04_win2.htm。 在主窗口里,在打开子窗口的时候,我们用于个变量,比
如 childWin 来记住子窗口

  childWin = window.open("adv04_win2.htm", "childWin");

这样, childWin 就代表子窗口了。紧接着这一行,我们用子窗口 childWin
的一个变量, 比如 parentWin 来记住主窗口

  childWin.parentWin = this;

这里的 this 是一个很有意思的特殊变量 ,它代表当前的窗口或框架。现在
主窗口和子窗口都已经知道了对方。下面我们就告诉你如何来控制对方。

用子窗口来控制主窗口

在子窗口里,我们可以用变量 parentWin 来控制主窗口。这里我们简单的介
绍一下如何变换主窗口里面的网页。当然你可以控制主窗口里面的其他物体
就象你在主窗口里控制它们一样 ,区别是要加上 parentWin. 在物体和元素
的前面。

如果你想要更换主窗口里面的网页,用下面的语句就可达到

  parentWin.location = "new.htm";

更具体一些, 在子窗口里写一个如下的连接

<A href="#" onClick="javascript:parentWin.location='new.htm'">新页</A>

用主窗口来控制子窗口

同样道理 ,你也可以用主窗口里面的子窗口变量来控制子窗口。 比如你想
要更换子窗口里面的网页,用下面的语句就可达到

  childWin.location = "new.htm";

更具体一些, 在主窗口里写一个如下的连接

<A href="#" onClick="javascript:childWin.location='new.htm'">新页</A>

实例

这个实例可也让你用子窗口的连接来变化主窗口里面的内容,也就是来更换
主窗口里的网页。

实例