logo标签列表

当弹出窗口关闭时，我该如何触发一个事件（使用jQuery或原生JavaScript）？

javascriptjquery
12

我希望在一个弹出窗口被关闭时或最好是在关闭之前触发一个事件。我将弹出窗口对象存储为一个对象，但我不知道如何绑定到关闭事件，或者在窗口关闭之前触发一个事件。

var popupWindow = window.open("/popup.aspx", "popupWindow", "height=550,width=780");

有没有办法使用jQuery或原生javascript订阅关闭事件？我正在使用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的"unload"事件不会像通常那样保持订阅窗口：

popupWindow.onunload = function(){alert('hello')};

每次触发事件时似乎都会取消订阅。这样做是有意为之吗？如果不是jQuery中的这个错误（或特性？），那么在加载时触发事件将是很好的，因为我可以在事件内部检查 popupWindow.closed 属性以确保窗口真正关闭。

8个回答
18

我创建了一个监视器，用于检查窗口是否已关闭：

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

我尝试了观察器方法，但在IE6中使用时遇到了“权限被拒绝”的问题。这是由于在关闭窗口事件周围未完全访问闭合属性所导致的...但幸运的是，通过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);

谢谢Magnus。
3
我想我已经明白了发生了什么：
当您使用window.open时，它会打开一个具有位置“about:blank”的新窗口，然后在函数调用时将其更改为提供的url。
因此，在从“about:blank”更改为正确的url之前绑定了卸载事件，并在更改发生时触发。
我用JQuery做到了这一点：
$(function(){
    var win = window.open('http://url-at-same-domain.com','Test', 'width=600,height=500');
    $(win).unload(function(){
        if(this.location == 'about:blank')
        {
            $(this).unload(function(){
                // do something here
            });
        }
    });
});
2

jQuery卸载事件的代码示例

$(window).unload( function () { alert("再见！"); } );

来自jQuery卸载文档

编辑：

我尝试了一下，但无法让父窗口设置卸载。唯一能让它工作的方法是在弹出窗口HTML中存在脚本。弹出窗口还需要加载jQuery。我没有任何依据，但我认为卸载被触发，因为从父窗口的范围内卸载了弹出窗口。只是猜测。

1
0

关于之前提到的onunload，我必须提及一个微小的问题，基于我的经验：

Opera 9.0.x-9.2.x只有在用户离开页面时才会运行window.onUnload。如果用户关闭窗口，事件将永远不会触发。我怀疑这是为了解决自动重新加载弹出窗口的问题（即弹出窗口可以在页面关闭后重新打开）。

这很可能持续到Opera 9.5.x。其他浏览器也可能实现这一点，但我不认为IE或Firefox会这样做。

0

从我所了解的情况来看，jQuery unload 只是原生函数的一个包装器。我可能错了，因为我没有深入挖掘。

这个例子对我起作用了。

$(document).ready(function(){
    $(window).unload( function (){
        alert('preget');
        $.get(
            '/some.php',
            { request: 'some' }
        );
        alert('postget');
    });
});

请记住，一些浏览器在卸载时会阻止window.open请求，例如IE浏览器。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接