如何监听子窗口关闭?

IT技术 javascript dom-events cross-domain
2021-03-22 15:15:05

我正在以这种方式为 Facebook 共享打开一个子窗口:

window.open(sharingUrl,'','toolbar=0,status=0,width=626,height=436');

当用户单击共享或关闭时,窗口会自动关闭...

有没有办法为这些事件添加侦听器?

3个回答

如果在调用 时存储对子窗口的引用window.open(),则可以setInterval()使用该window.closed属性轮询以查看窗口是否仍处于打开状态下面的示例每秒检查两次。

var child = window.open('http://google.com','','toolbar=0,status=0,width=626,height=436');
var timer = setInterval(checkChild, 500);

function checkChild() {
    if (child.closed) {
        alert("Child window closed");   
        clearInterval(timer);
    }
}

对其他人的注意:如果您曾经处于可以控制子窗口中的 html 的情况,您可以利用onbeforeunload事件并提醒父窗口。

如果setInterval调用一个直到之后才定义的函数,为什么这会起作用
2021-04-28 15:15:05
@HelpingHand 由于功能提升。
2021-04-30 15:15:05
然后你可以创建一个动态页面,它生成一个 100% 大小的 iframe,该页面将onbeforeunload在关闭时触发
2021-05-01 15:15:05
在默认条件下,这不会在 Chrome 之类的地方工作,这会阻止弹出窗口并且对 child 的引用将为空吗?因此,您会在 null/undefined 上调用 .closed,我认为这可能会出错。哦,如果页面只是尝试在没有用户交互的情况下打开它,Chrome 将阻止弹出窗口。
2021-05-07 15:15:05
@彼得P。你是对的。这个答案并不能防止这种情况。我在这里写了一些简单的代码来展示上述问题的一般解决方案。肯定还有更多的事情需要考虑。
2021-05-10 15:15:05

为了将来参考,我想分享另一个不需要的解决方案setInterval

var child = window.open('http://google.com','','toolbar=0,status=0,width=626,height=436');
child.onunload = function(){ console.log('Child window closed'); };
一个建设性的评论而不是负 1 将不胜感激。你用什么浏览器来测试这个。
2021-04-23 15:15:05
我试过这个。但是即使用户从同一个子窗口导航到不同的网页,卸载事件也会被触发。如何检测实际的窗户关闭?
2021-05-06 15:15:05
同源适用,这使得不同域无法附加这样的处理程序。
2021-05-16 15:15:05
@diosney 您可能已经解决了问题,但请为目前正在寻找类似问题的人留下评论。我创建时禁用了窗口打开功能,以便只有在窗口关闭时才能识别卸载事件。
2021-05-21 15:15:05

这将正常工作

   <html>
<head>
<title>Detecting browser close in IE</title>
<script type="text/javascript">

window.onbeforeunload = function(){ myUnloadEvent(); }
function myUnloadEvent() {
    alert ('You can have Ur Logic Here ,');

}

</script>
</head>
</script>
</head>
<body >
<h1>Close the Window now</h1>
</body>
</html>
这对 Oleg 不起作用,因为他正在子窗口中打开 Facebook 页面。他没有(我猜)有能力改变 html 的 Facebook 代码。
2021-04-26 15:15:05
他没有,这将是一个安全问题,您在跨域操作方面非常有限。
2021-04-28 15:15:05