跨浏览器onbeforeunload？答案

【问题标题】：Crossbrowser onbeforeunload?跨浏览器onbeforeunload？
【发布时间】：2011-11-15 09:58:53
【问题描述】：

window.onbeforeunload() 是否会在所有浏览器中触发？我需要至少受 IE6 和 FF3.6 支持的 onbeforeunload 功能。

对于 IE，onbeforeunload() 似乎只是 supported by IE9

【问题讨论】：

@Šime Vidas 酷！感谢该代码将非常有用！
@Šime Vidas，在github.com/jquery/jquery/blob/master/src/event.js 中没有找到任何有用的东西：(
onbeforeunload 在该脚本中。使用 CTRL + F 搜索...
@powtac : 你完成测试了吗？
@powtac ：如果您需要帮助，请慢慢来询问

标签： javascript cross-browser onbeforeunload

【解决方案1】：

基于 Tushar Ahirrao 解决方案，它可以跨浏览器运行并触发一次（适用于 Firefox、Chrome 等）

<html>
<head>
<script type="text/javascript">
var app = {};
app.unloaded = false;
app.unload = function() {
    if (app.unloaded) return; else app.unloaded = true;
    // your code here
    return "YO";
};
</script>
</head>
<body onunload="return app.unload();" onbeforeunload="return app.unload();">
YO
</body>
</html>

将上面的模板粘贴到空文件然后编辑它

【讨论】：

【解决方案2】：

不，它不会在所有浏览器中触发。移动浏览器不支持它，例如Safari，Opera Mobile & mini，海豚。见Is there an alternative method to use onbeforeunload in mobile safari?

【讨论】：

是的。 OP 询问“window.onbeforeunload() 是否会在所有浏览器中触发？”我的回答是“移动浏览器不支持它”。
虽然此链接可能会回答问题，但最好在此处包含答案的基本部分并提供链接以供参考。如果链接页面发生更改，仅链接的答案可能会失效。
虽然我大体上同意，但在这种情况下，我的回答确实包括链接文章的基本部分（移动浏览器不支持），而且我正在链接到 SO，所以链接不会变成无效。

【解决方案3】：

我找到了一个带有 setTimeout 函数的 Firefox 解决方法，因为它与其他网络浏览器的行为不同。

window.onbeforeunload = function (e) {
    var message = "Are you sure ?";
    var firefox = /Firefox[\/\s](\d+)/.test(navigator.userAgent);

    if (firefox) {
        //Add custom dialog
        //Firefox does not accept window.showModalDialog(), window.alert(), window.confirm(), and window.prompt() furthermore
        var dialog = document.createElement("div");
        document.body.appendChild(dialog);
        dialog.id = "dialog";
        dialog.style.visibility = "hidden";
        dialog.innerHTML = message; 
        var left = document.body.clientWidth / 2 - dialog.clientWidth / 2;
        dialog.style.left = left + "px";
        dialog.style.visibility = "visible";  
        var shadow = document.createElement("div");
        document.body.appendChild(shadow);
        shadow.id = "shadow";       
        //tip with setTimeout
        setTimeout(function () {
            document.body.removeChild(document.getElementById("dialog"));
            document.body.removeChild(document.getElementById("shadow"));
        }, 0);
    }

    return message;
}

GitHub：https://github.com/Aelios/crossbrowser-onbeforeunload

【讨论】：

not seem to catch onbeforeunload event如果有原生onbeforeunload事件是什么意思？
其实Opera并不知道onbeforeunload事件，仅此而已
在 Chromium 上，这会为我弹出一个确认对话框。但是，如果我return null，则不会。
很酷的解决方案！如果您想从 Github 添加一个链接返回到此讨论，以保持此讨论中的知识相互联系...
@Aelios，这会导致像 Opera 这样的浏览器在卸载之前触发 onbeforeunload 事件吗？

【解决方案4】：

然后你可以像这样使用两者：

<body onunload="functionName();" onbeforeunload='functionName();' >

【讨论】：

但是支持这两个事件的浏览器会执行两次。
@pimvdb..then 使用一个标志 ..如果它为 true 则执行函数，一旦执行则使其为 false。
这个答案太原始了。需要解释，因为它不是很有帮助。
一个带有 var 的函数来检查它是否已经被触发在这里是可以的。

【解决方案5】：

我记得 IE 是唯一实现onbeforeunload 的浏览器，但有些浏览器已经自行实现了它。

长话短说，IE 是唯一一个您会始终在其中找到此事件的浏览器（除了非常有限的例外）。

【讨论】：

鉴于它是 Microsoft 产品，MSDN 将是一个很好的起点。
是的，我已经看到了这个页面，但是我没有看到任何关于 IE 版本支持的信息，或者我错过了什么？
@powtac：我相信它可以追溯到很久以前（尽管我记得这个事件在 IE8 中出现的问题）。您还可以test for support 并在找到时绑定并在不存在时默认。