Prevent a webpage from navigating away using JavaScript

Using onunload allows you to display messages, but will not interrupt the navigation (because it is too late). However, using onbeforeunload will interrupt navigation:

window.onbeforeunload = function() {  return "";}

Note: An empty string is returned because newer browsers provide a message such as "Any unsaved changes will be lost" that cannot be overridden.

In older browsers you could specify the message to display in the prompt:

window.onbeforeunload = function() {  return "Are you sure you want to navigate away?";}

Unlike other methods presented here, this bit of code will not cause the browser to display a warning asking the user if he wants to leave; instead, it exploits the evented nature of the DOM to redirect back to the current page (and thus cancel navigation) before the browser has a chance to unload it from memory.

Since it works by short-circuiting navigation directly, it cannot be used to prevent the page from being closed; however, it can be used to disable frame-busting.

(function () {    var location = window.document.location;    var preventNavigation = function () {        var originalHashValue = location.hash;        window.setTimeout(function () {            location.hash = 'preventNavigation' + ~~ (9999 * Math.random());            location.hash = originalHashValue;        }, 0);    };    window.addEventListener('beforeunload', preventNavigation, false);    window.addEventListener('unload', preventNavigation, false);})();

Disclaimer: You should never do this. If a page has frame-busting code on it, please respect the wishes of the author.

The equivalent in a more modern and browser compatible way, using modern addEventListener APIs.

window.addEventListener('beforeunload', (event) => {  // Cancel the event as stated by the standard.  event.preventDefault();  // Chrome requires returnValue to be set.  event.returnValue = '';});

Source: https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload