相信大家在web项目中,经常会用到javascript的事件监听、事件冒泡这些东西。当然也包括window.opener,window.showModalDialog这些父子窗口的互操作。
但不知道大家有没遇到这样一种情况,新开的窗口是通过<a href="" />打开 的,而不是window.opener或showModalDialog打开的。
尤其是需要注意的是:这个href指向的地址(页面)不是我们开发的,譬如,我们将href指向www.cnblogs.com。
OK,问题来了:假如我们在a 所在的页面有个按钮,可以触发点击事件并进行一些操作。 而这个点击事件需要在href打开的IE窗口关闭后触发。。。
这个时候,我们如何监视href打开的窗口呢?(通过javascript,不要说什么进程啥的东东).
假设有a.html如下:
1
3 < html xmlns ="http://www.w3.org/1999/xhtml" >
4 < head >
5 < title > a.html </ title >
6 < meta name ="generator" content ="editplus" />
7 < meta name ="author" content ="" />
8 < meta name ="keywords" content ="" />
9 < meta name ="description" content ="" />
10 </ head >
11
12 < body >
13 < input type ="button" id="btnParent" onclick ="alert('a');" value ="Click !" />
14 < a href ="http://www.cnblogs.com" target ="_blank" > Link to B.HTML </ a >
15 </ body >
16 </ html >
现在的要求就是:点击 "Link to B.HTML" 打开http://www.cnblogs.com。
打开的新窗口关闭后,触发a.html中的 btnParent 的点击事件~~~~
---
我相信很少有人做过这样的应用,或碰到这样的问题。 而我现在刚好碰到这样一个需求。
因此将问题发到这里来,让大家帮忙给揣摩揣摩。
虽然文章内容很少,但我想,这样一个问题还是值得上首页的。~~~^_^
-------------------------------
终于有高人提到了用window.closed这个属性来判断新开的窗口是否关闭(并用setInterval来实现监听的效果)。而且window.closed是可以跨域的。
(个人认为:打开的新窗口返回的window对象与窗口中的window对象是两个东西,读取后者会存在跨域问题,而前者是本地的东西)
当然,要使用window.closed这个东西,我们还得先获取window对象,由于需要是新开窗口,因此我们可以用window.open。下面是具体实现代码:
( 可以移步keyapril同学的回复处查看)
2 < html xmlns ="http://www.w3.org/1999/xhtml" >
3 < head >
4 < meta http-equiv ="Content-Type" content ="text/html; charset=utf-8" />
5 < title > 无标题文档 </ title >
6 < script type ="text/javascript" >
7 var $ = function ()
8 {
9 if ( ! arguments || arguments.length != 1 )
10 {
11 throw new Error( ' the arguments is needed ' );
12 }
13 if ( typeof arguments[ 0 ] === ' string ' )
14 {
15 return document.getElementById(arguments[ 0 ]);
16 }
17 if ( typeof arguments[ 0 ] === ' function ' )
18 {
19 if (window.addEventListener)
20 {
21 window.addEventListener( ' load ' ,arguments[ 0 ], false );
22 }
23 if (window.attachEvent)
24 {
25 window.attachEvent( ' onload ' ,arguments[ 0 ]);
26 }
27 }
28 }
29 $( function (){
30 $( ' a1 ' ).onclick = function (event)
31 {
32 var e = event || window.event;
33 var newW = window.open( this .href);
34 var inter = window.setInterval( function (){
35 if (newW.closed){
36 window.clearInterval(inter);
37 $( ' btn1 ' ).click();
38 }
39 }, 100 );
40
41 return false ;
42 }
43 $( ' btn1 ' ).onclick = function (event)
44 {
45 var e = event || window.event;
46 alert( ' the window is closed! ' );
47 }
48 });
49 </ script >
50 </ head >
51
52 < body >
53 < input type ="button" id ="btn1" value ="Click" />
54 < a id ="a1" href ="http://www.cnblogs.com" > link </ a >
55 </ body >
56 </ html >
57
-------------------------------