在窗口关闭或页面刷新时运行JavaScript代码？

Question

当用户关闭浏览器窗口或刷新页面时,有没有办法运行最终的JavaScript代码？

我正在考虑类似于onload的东西,但更像是onclose？谢谢.

我不喜欢onbeforeunload方法,它总是会弹出一个确认框(保留页面/停留在mozilla上)或(重新加载/不重新加载chrome).有没有办法安静地执行代码？

Answer 1

有两种window.onbeforeunload和window.onunload,根据浏览器的不同使用.您可以通过将窗口属性设置为函数或使用以下内容来为它们提供帮助.addEventListener:

window.onbeforeunload = function(){
   // Do something
}
// OR
window.addEventListener("beforeunload", function(e){
   // Do something
}, false);

通常,onbeforeunload如果您需要阻止用户离开页面(例如,用户正在处理一些未保存的数据,那么他/她应该在离开之前保存).据我所知,Operaonunload不支持,但您可以随时设置两者.

Answer 2

好的,我找到了一个有效的解决方案,它包括使用beforeunload事件然后让处理程序返回null.这将执行所需的代码而不会弹出确认框.它是这样的:

window.onbeforeunload = closingCode;
function closingCode(){
   // do something...
   return null;
}

希望这可以帮助.

Answer 3

jQuery版本:

$(window).unload(function(){
    // Do Something
});

更新:jQuery 3:

$(window).on("unload", function(e) {
    // Do Something
});

谢谢加勒特

Answer 4

有时您可能想让服务器知道用户正在离开页面。例如，这对于清除临时存储在服务器上的未保存图像，将该用户标记为“脱机”或在完成会话时进行记录很有用。

过去，您会在beforeunload函数中发送AJAX请求，但是这有两个问题。如果发送异步请求，则不能保证该请求将被正确执行。如果您发送同步请求，则它更可靠，但是浏览器将挂起，直到请求完成。如果这是一个缓慢的请求，则将给用户带来极大的不便。

幸运的是，我们现在有了navigator.sendBeacon()。通过使用该sendBeacon()方法，当用户代理有机会将数据异步传输到Web服务器时，不会延迟卸载或影响下一个导航的性能。这解决了提交分析数据时遇到的所有问题：数据可靠地发送，异步发送，并且不影响下一页的加载。这是一个用法示例：

window.addEventListener("unload", logData, false);

function logData() {
  navigator.sendBeacon("/log.php", analyticsData);
}

sendBeacon()在以下位置受支持：

• 边缘14
• Firefox 31
• 铬39
• Safari 11.1
• 歌剧26
• iOS Safari 11.4

当前不支持它：

• IE浏览器
• Opera Mini

如果您需要添加对不受支持的浏览器的支持，这是sendBeacon（）的polyfill。如果该方法在浏览器中不可用，它将发送一个同步的AJAX请求。

Answer 5

你可以用window.onbeforeunload.

window.onbeforeunload = confirmExit;
function confirmExit(){
    alert("confirm exit is being called");
    return false;
}

Answer 6

这里的文档鼓励在窗口上监听onbeforeunload事件和/或添加事件监听器.

window.addEventListener('beforeunload', function(event) {
  //do something here
}, false);

您还可以使用函数或函数引用填充窗口的.onunload或.onbeforeunload属性.

虽然浏览器的行为没有标准化,但该功能可能会返回浏览器在确认是否离开页面时将显示的值.

Answer 7

该事件被调用beforeunload，因此您可以为 分配一个函数window.onbeforeunload。