onbeforeunload 和 onunload 的区别

IT技术 javascript ipad safari mobile-safari onbeforeunload
2021-03-15 07:56:36

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),我也不会收到警报。

我想知道是否有其他方法可以解决此问题?

谢谢你。

4个回答

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

onbeforeunload 效率更高,因为它不会与实际关闭窗口竞争运行,并且会在之前触发 onunload

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

window.onunload = window.onbeforeunload = (function(){...
非常感谢……但是对 iPad 的实现有任何想法吗?
2021-04-17 07:56:36
@ShahidulHaque 您将需要编写代码来检测第二次触发并忽略它。
2021-04-21 07:56:36
window.onunload = window.onbeforeunload = (function(){..., 如果浏览器对这两个事件都没有问题,将执行该函数两次。
2021-05-02 07:56:36
@noboundaries-如何修复这两次触发的修复?
2021-05-12 07:56:36

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

var onBeforeUnLoadEvent = false;

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

onbeforeunload

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

onunload

  • 卸载开始后调用,但任何资源释放之前(它不是很清楚,我究竟在此期间完成)
  • 此时取消页面关闭为时已晚

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

如果要在某些 iPhone 中查看该页面,您会发现该页面onbeforeunload不会被处理。
2021-05-08 07:56:36

onbeforeunload之间的一个显着区别(可取消性除外)onunload是前者是针对下载链接触发的,而后者则不是。示例:<a href="https://somewhere.com/thething.zip">download</a>将触发onbeforeunload处理程序,但不会触发onunload.

我无法在 Chrome 上重现此内容。你有这方面的任何文件吗?
2021-05-08 07:56:36