关闭弹出窗口时,如何引发事件(jQuery或者Vanilla Javascript)?
我想在关闭弹出窗口时或者最好在关闭窗口之前引发一个事件。我将弹出窗口对象存储为一个对象,但是我不知道绑定到close事件或者窗口关闭前的事件的任何方法。
var popupWindow = window.open("/popup.aspx", "popupWindow", "height=550,width=780");
有什么方法可以使用jQuery或者仅使用原始javascript来订阅close事件?我使用的是jQuery,并且无法添加其他库,因此,如果无法在jQuery中完成,则必须以某种方式滚动我自己的事件系统,以便它可以在所有浏览器上正常工作。
更新:
我尝试在jQuery中使用unload事件,由于某种原因,该事件在我的弹出窗口打开时(而不是在关闭时)立即引发。如果我使用Firebug设置一个断点来延迟卸载事件的订阅,则卸载事件将按照预期的方式运行,但是由于任何原因,当允许javascript自然执行时,它均无法正常工作。
var popupWindow = window.open("/popup.aspx", "popupWindow", "height=550,width=780"); $(popupWindow.window).unload(function() { alert('hello'); });
有人对窗口加载时为什么会引发unload事件有任何想法吗?
另一个要注意的是,我注意到jQuery的"卸载"事件并没有像我平常那样只订阅窗口:
popupWindow.onunload = function(){alert('hello')};
似乎每次事件都取消订阅该事件。这应该发生吗?如果不是因为jQuery中的这个错误(或者功能?),最好在加载时引发事件,因为我可以检查事件内部的popupWindow.closed
属性以确保窗口确实关闭了。
解决方案
使用window.onUnload
我们必须让onBeforeUnload事件调用一个方法来通知处理程序。
请参见此页面的演示。
http://www.4guysfromrolla.com/demos/OnBeforeUnloadDemo1.htm
卸载事件的jQuery代码示例
$(window).unload(function(){alert(" Bye now!");});`
从jQuery卸载文档
编辑:
我玩了一下,但无法获取父窗口来设置卸载。我可以使它正常工作的唯一方法是在弹出窗口html中显示脚本。弹出窗口还需要加载jQuery。我没有任何依据,但是我相信卸载会被触发,因为从本质上说,弹出窗口是从父窗口的范围中卸载的。只是一个猜测。
根据我以前的经验,与前面提到的onunload相比,我不得不提一个小问题:
如果用户离开页面,Opera 9.0.x-9.2.x仅运行window.onUnload。如果用户改为关闭窗口,则该事件将永远不会触发。我怀疑这样做是为了解决自动重新加载弹出窗口的问题(弹出窗口可以在关闭页面时重新打开自身)。
这很可能一直存在于Opera9.5.x。其他浏览器也可以实现此功能,但我不相信IE或者Firefox可以实现。
从我检查的结果来看,jQuery的卸载只是本机功能的包装。我可能挖错了,因为我没有那么深入地挖掘。
这个例子对我有用。
$(document).ready(function(){ $(window).unload( function (){ alert('preget'); $.get( '/some.php', { request: 'some' } ); alert('postget'); }); });
请记住,某些浏览器会阻止window.open卸载请求,例如IE。
我创建了一个观察器,该观察器检查窗口是否已关闭:
var w = window.open("http://www.google.com", "_blank", 'top=442,width=480,height=460,resizable=yes', true); var watchClose = setInterval(function() { if (w.closed) { clearTimeout(watchClose); //Do something here... } }, 200);
我尝试了观察者方法,但在IE6中使用它时遇到了"权限被拒绝"问题。发生这种情况是由于在关闭窗口时无法完全访问close属性...但是幸运的是,通过try {} catch构造,它虽然可以:o)起作用
var w = window.open("http://www.google.com", "_blank", 'top=442,width=480,height=460,resizable=yes', true); var watchClose = setInterval(function() { try { if (w.closed) { clearTimeout(watchClose); //Do something here... } } catch (e) {} }, 200);
谢谢你马格努斯