温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

JavaScript中的子窗口与父窗口的互相调用问题

发布时间:2020-08-28 14:02:52 来源:脚本之家 阅读:358 作者:孫瑞 栏目:web开发

注意:要用open打开才行,如果用openModal打开则会访问不到opener.

open的参数:

 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') 

参数说明

'page.html' 弹出窗口的文件名; 'newwindow' 弹出的新窗口的名字,非必须,可用空''代替; 

height=100 高度; width=400 宽度; top=0 窗口距离屏幕上方的象素值; left=0 窗口距离屏幕左侧的象素值; 

toolbar=no 是否显示工具栏,yes为显示; menubar,scrollbars 表示菜单栏和滚动栏;

resizable=no 是否允许改变窗口大小,yes为允许; location=no 是否显示地址栏,yes为允许;

status=no 是否显示状态栏内的信息(通常是文件已经打开),yes为允许;

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> 

3、子窗口关闭并刷新父口,这里有两种方式:

1)         子窗口关闭时关闭父窗口:

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

2)        父窗口去检测,子窗口是否已经关闭了,在设定的一段时间之后自动刷新:

 <script> var newWindow; var timer; function openWindow(url) { newWindow = window.open(url, "", "width=400,height=300,resizable=yes"); timer = setInterval("updateAfterClose()", 1000); } function updateAfterClose() { //父窗口去检测子窗口是否关闭,然后通过自我刷新,而不是子窗口去刷新父窗口 if(newWindow.closed == true) { clearInterval(timer); self.location.reload(); // 主窗口刷新 return; } } </script> 

4、父窗口关闭的时候关闭子窗口。这个就是用方法去检测父窗口的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()"> 

5、子窗口中关闭父窗口,这个功能可能相对要少用一点:

 <script> function closeParent() { opener.close(); } </script> <input type=button value="关闭父窗口" onclick=closeParent()> 

以上所述是小编给大家介绍的JavaScript中的子窗口与父窗口的互相调用问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对亿速云网站的支持!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI