Crossbrowser onbeforeunload? Crossbrowser onbeforeunload? javascript javascript

Crossbrowser onbeforeunload?


I found a workaround for Firefox with setTimeout function because it does not have the same behaviour as other web browsers.

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


No it does not fire in all browsers. It's not supported in mobile browsers e.g. Safari, Opera Mobile & mini, Dolphin. See Is there an alternative method to use onbeforeunload in mobile safari?


Building upon Tushar Ahirrao solution this works cross browser and triggers once (Works in Firefox, Chrome, whatever)

<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>

Paste above template to empty file then edit it