JavaScript 捕获弹出窗口的关闭事件

IT技术 javascript dom-events
2021-02-11 00:13:06

我需要在弹出窗口(使用window.open)关闭之前执行一些操作

像这样的东西会很好:

var new_window = window.open('some url')
new_window.onBeforeUnload = function(){ my code}

我怎样才能做到这一点?

6个回答

虽然接受的答案对于同源是正确的,但我找到了跨源弹出窗口的解决方案:

var win = window.open('http://www.google.com'); 
var timer = setInterval(function() { 
    if(win.closed) {
        clearInterval(timer);
        alert('closed');
    }
}, 1000);

资料来源:atashbahar.com

对于那些考虑使用它的人。

甚至 Facebook 也在他们的Javascript SDK 中使用这个“hack”

您可以通过查看他们的代码来验证这一点。只需.closedhttps://connect.facebook.net/en_US/sdk.js 中搜索即可

我不相信这是专门针对跨域的黑客攻击,它实际上是检测窗口已关闭的唯一准确方法。每当窗口内的文档被卸载时,都会触发 unload 和 beforeunload 事件,这可能是由于重定向或重新加载,因此不一定意味着窗口已关闭。
2021-03-17 00:13:06
我刚刚在 IE11 - WIN7 上对其进行了测试: var win = window.open('https://www.google.com/') 当用户允许弹出窗口时,该win变量将包含预期的对象。当然,您必须使用用户触发的事件来调用它。(例如onClick在某事上)
2021-03-29 00:13:06
好东西。谢谢!
2021-03-30 00:13:06
我刚刚使用 Edge(2021 年 3 月)测试了该解决方案,我正在监控同一域的窗口关闭事件,即在我的应用程序中打开然后关闭的其他窗口,这很好用!
2021-03-30 00:13:06
不幸的是,这在 Microsoft Edge 中似乎不起作用
2021-04-12 00:13:06

只要弹出窗口 url 与父页面在同一个域中,并且您将事件更改为全部小写,您的示例就会起作用

var new_window = window.open('some url')
new_window.onbeforeunload = function(){ /* my code */ }
@xiaohan2012 有一个黑客。请参阅我的回答stackoverflow.com/questions/9388380/...
2021-03-15 00:13:06
@glortho 这种方法比在 new_window 中定义 onbeforeunload 事件有什么优势吗?更具体地说,即使在加载 new_page 及其脚本之前,这是否会立即将代码与 new_window 绑定?
2021-03-20 00:13:06
您能做的最好的事情是在您的域中打开一个文档,然后在 iframe 中加载远程 URL,或者通过服务器脚本读取它并从那里呈现它。
2021-04-01 00:13:06
这实际上不是检测窗口已关闭的准确方法。unload 和 beforeunload 事件在窗口内的文档被卸载时被触发,例如,这可能是由于重定向或重新加载。有关准确方法,请参阅 @DustinHoffner 的回答 ( stackoverflow.com/a/48240128/51055 )。
2021-04-11 00:13:06
如果新打开的窗口与父窗口不在同一个域中怎么办?有没有黑客?
2021-04-13 00:13:06

事件名称是onbeforeunload而不是onBeforeUnloadJS 区分大小写。

如果我们通过在其上使用附加事件将其作为内联属性附加到 html 并且 html 对大小写敏感,这意味着这绝对没有区别
2021-03-21 00:13:06

您需要onbeforeunload在打开窗口后将事件绑定到窗口。

最简单的方法是在窗口源代码中使用 javascript onbeforeunload 代码。

有关详细说明,请参阅Stackoverflow 上的这两个非常相似的问题herehere

谢谢你。事实上onbeforeunload并且onunload必须在子窗口加载后才能正常工作。
2021-04-12 00:13:06

onbeforeunload必须加载弹出窗口添加事件例如,您可以将它添加到加载事件的末尾,如下所示;

const new_window = window.open('some url')
new_window.onload = function(){ 
    /* my code */ 
    this.onbeforeunload = function(){ /* my code */ }
}