onbeforeunload 和 onunload 之间的区别

Question

onbeforeunload 和 onunload 之间有什么区别？ 另外，我有一个与其在 iPad 上使用相关的具体问题...我有一个页面 (myPage.html)，我试图在页面关闭时显示警报（即按下 X 来关闭 iPad 上的选项卡）

现在我尝试同时使用 window.onunload 和 window.onbeforeunload 以下是我在 iPad 上的发现；

1. 使用 window.onunload ，当用户导航到与 myPage.html 不同的页面时（通过单击某个链接或在 myPage.html 上进行 Google 搜索），我能够收到警报。但是，当从最小化视图 (X) 关闭选项卡时，没有任何反应

2. 使用 window.onbeforeunload，即使用户从 myPage.html 导航到不同的页面或者关闭选项卡 (X)，我也不会收到警报 。

我想知道是否有其他方法可以解决这个问题？

谢谢。

Answer 1

onunload 负责在页面关闭时执行一条指令。它还会导致 IE 和 AJAX 出现问题。

onbeforeunload 效率更高，因为它不会与窗口的实际关闭竞争，而是在 onunload 之前触发。

我知道 Opera 过去不承认 onbeforeunload code> - 不确定他们是否已经解决了这个问题，但我总是注册监听器以确保安全：

window.onunload = window.onbeforeunload = (function(){...

Answer 2

添加 AlienWebguy 的 ans，以避免在支持这两个事件的浏览器上进行双重调用，

var onBeforeUnLoadEvent = false;

window.onunload = window.onbeforeunload= function(){
if(!onBeforeUnLoadEvent){
  onBeforeUnLoadEvent = true;
  //your code here
  }
};

Answer 3

onbeforeunload：

• 在卸载开始之前调用
• MDN 告诉me 你可以使用 event.preventDefault(); 取消关闭页面
• ，或者通过返回一个非空值（即值！= 0），页面会弹出一个允许用户选择取消关闭的确认对话框
• MDN 还表示 Opera 12 及更高版本支持 onbeforeunload - 看起来它已经支持了一段时间

onunload：

• 在卸载开始后但在任何资源之前调用释放（我不清楚在此期间到底做了什么）
• 此时取消页面关闭为时已晚

我能想到的唯一原因是您想要使用onunload 结束onbeforeunload 是您的 onunload 代码可能需要花费大量时间的地方，并且不希望用户看到关闭时挂起的窗口。

Answer 4

onbeforeunload 和 onunload 之间的一个显着区别（除了可取消性之外）是前者针对下载链接而触发，而后者则不会。示例： down​​load 将触发 onbeforeunload 处理程序，但不会触发onunload。