子窗口与父窗口的通信

Author : luckyGirl

今天遇到了个issue,通过window.open()方式打开的子窗口在关闭时要刷新父窗口的部分内容,Google了下找到了相关解决办法.

具体解决办法如下: 使用 window.opener调用父窗口的JS function 代码如下
父窗口JS
function parentFunc(){}

子窗口JS
window.onbeforeunload = function(){
if(!window.opener.closed){
window.opener.parentFunc();
}};

当然也可以使用window.opener查找父窗口的元素进行修改
Note: 父窗口与子窗口的JS是同域的,同时子窗口打开时父窗口也未关闭

另外再附上window.open()的基本使用:
① window.open()支持环境: JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+
② 基本语法: window.open(pageURL,name,parameters) ,其中:
pageURL 为子窗口路径
name 为子窗口句柄
parameters 为窗口参数(各参数用逗号分隔)
③ 各项参数
其中yes/no也可使用1/0;pixel value为具体的数值,单位象素
参数 取值范围 说明
alwaysLowered yes/no 指定窗口隐藏在所有窗口之后
alwaysRaised yes/no 指定窗口悬浮在所有窗口之上
depended yes/no 是否和父窗口同时关闭
directories yes/no Nav2和3的目录栏是否可见
height pixel value 窗口高度
hotkeys yes/no 在没菜单栏的窗口中设安全退出热键
innerHeight pixel value 窗口中文档的像素高度
innerWidth pixel value 窗口中文档的像素宽度
location yes/no 位置栏是否可见
menubar yes/no 菜单栏是否可见
outerHeight pixel value 设定窗口(包括装饰边框)的像素高度
outerWidth pixel value 设定窗口(包括装饰边框)的像素宽度
resizable yes/no 窗口大小是否可调整
screenX pixel value 窗口距屏幕左边界的像素长度
screenY pixel value 窗口距屏幕上边界的像素长度
scrollbars yes/no 窗口是否可有滚动栏
titlebar yes/no 窗口题目栏是否可见
toolbar yes/no 窗口工具栏是否可见
Width pixel value 窗口的像素宽度
z-look yes/no 窗口被激活后是否浮在其它窗口之上

④ 例子:
<script language=”JavaScript”>
<!–
window.open (‘page.html’,’newwindow’,’height=100,width=400,top=0,left=0,
toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no’)
//写成一行
–>
</
script >

脚本运行后,page.html将在新窗体newwindow中打开,宽为100,高为400,距屏顶0象素,
屏左0象素,无工具条,无菜单条,无滚动条,不可调整大小,无地址栏,无状态栏

参考资料:window.open() 支持环境,语法,参数,例子(详细)

standard

Have your say