JS 子窗口操作父窗口实例详解-百分百源码网

JS 子窗口操作父窗口实例详解

发布时间：01/15 来源：浏览：关键词：

子父窗口相互操作我们只要使用newWindow.document.getElementById与opener.location.reload来操作，各位同学可进入参考。

1、从子窗口中往父窗口传值

如父页面有一个控制的id是choosedProvider，那么这样可以把值传给父页面：

代码如下
opener.document.getElementById("choosedProvider”]).value=”Tom”;

2、从父窗口传值给子窗口，如子窗口中有id为T的控件，此时可以用如下传值：

代码如下
<script> var newWindow; function openWindow(url){ newWindow = window.open(“new.htm”, "", "width=400,height=300 "); } function changeChild(){ newWindow.document.getElementById("T").value="我变了"; } </script>

再看一个子窗口关闭了，父窗口自动刷新

子窗口关闭时关闭父窗口：

opener.location.reload();
window.close();

实现的效果大致如下，打开1.htm，点击链接新建窗口2.htm，点击2.htm中的链接，新建的窗口关闭并在
1.htm窗口重定向。

1.htm代码如下

代码如下
<html> <body> <a href=2.htm onclick=”window.open(’2.htm’)”>new</a> </body> </html>

2.htm代码如下

代码如下
<html> <body> <a href=# onclick=”opener.location.href=’http://baidu.com’;window.close()”>nbn</a> </body> </html>

上面我们只使用了子窗口操作上极窗口，当然我们还可以子父窗口一起操作了

父窗口关闭的时候关闭子窗口。这个就是用方法去检测父窗口的onunload事件：

代码如下
<script> var newWindow; function openWindow(url) { newWindow = window.open(url, "", "width=400,height=300,resizable=yes"); } function closeChild() { newWindow.close(); } </script> 在body加上onunload事件： <body onunload="closeChild()">