Javascript：IE 和 Chrome 中的 onBeforeUnload() 行为答案

【问题标题】：Javascript: onBeforeUnload() behaviour in IE and ChromeJavascript：IE 和 Chrome 中的 onBeforeUnload() 行为
【发布时间】：2011-05-18 00:55:48
【问题描述】：

我有这段代码：

window.onbeforeunload = 函数（）{ 做点什么（）; return "你确定要离开吗"; }

在 Firefox 中，当用户离开页面时，doSomething() 首先被执行，然后弹出警报。在 IE 和 Chrome 中，警报首先弹出，然后如果用户决定留下doSomething() 被执行。

有没有办法让 IE 和 Chrome 的行为像 Firefox。我想在弹出窗口之前执行doSomething()。

【问题讨论】：

在我的工作中，我们这样做：if(hasChanges && confirm('do you want to save?')) { saveToDb(); };，我知道这不是同一个例子，但尝试使用将最后一行更改为 return confirm("Are you sure you want to leave")。
顺便说一句：jsfiddle.net/whd9y 在我电脑上的所有浏览器 (IE/FF/GC) 上都一样。
@Alxandr :: jsfiddle.net/whd9y/1 在 IE 和 FF 中试试这个。在 IE 中，它不会更改 div 的 html，直到用户选择留在同一页面上。
这只是 GUI 不显示更新，直到您关闭弹出窗口。 GUI 线程被阻塞，因此无法显示更改。

标签： javascript google-chrome internet-explorer firefox dom-events

【解决方案1】：

您使用的是哪个版本的 Firefox？据我所知，除了传递文本以包含在弹出的确认对话框中之外，没有任何浏览器应该让您在 onBeforeUnload 上执行任何操作 - 因此您无法阻止用户离开您的网站。

您不应依赖此事件来确保在用户离开您的页面时发生任何事情。如果这很重要，请为可以离开页面的所有内容分配一个单击事件处理程序（您仍然会丢失浏览器导航按钮和地址栏更改）

【讨论】：

这个事件在大多数浏览器中都能正常工作。我已经将它与 ajax 一起使用来进行数据库更改（当然使用同步模式），并且它完全可以正常工作。如果您想要进行一些 HTML 更改以吸引用户的注意力，而不是警报窗口，它具有不同的行为。
在 ajax 请求的情况下，调用何时触发并不重要，只要您保存数据库即可。
据我所知，您唯一不能做的就是发送 XHR。您关于向所有内容添加点击处理程序的评论非常幼稚。用户可以关闭浏览器，点击后退按钮，点击刷新。总体而言，此答案中没有好的信息
@Juan Mendes 感谢您对我的回答如此感兴趣，并感谢您的反馈，但我不同意我的评论是幼稚的，因为我明确指出了您强调的缺点。我的目的是指出“您不应该依赖此事件来确保在用户离开您的页面时发生任何事情”，因为 onBeforeUnload 有很大的限制。我想我做得很清楚。此外，您关于不发送 XHR 的评论似乎直接与 user425575 所说的他们在前面的评论中成功完成的内容相矛盾。 tl;dr - 多加注意？
@tomfumb：这不是我的经验。跨浏览器无法可靠地发送 XHR。我记得它在某些情况下有效，但在 Safari 上无效，因此我们在 DOM 中附加了一个 img ，导致请求发出，但我希望 Safari 已经修复了这个漏洞。但是，我将信息存储到 cookie 中并从 onbeforeunload 处理程序修改 DOM，跨浏览器没有问题。