Cancel onbeforeunload event handler?

Question

I have an onbeforeunload event handler attached to the page which executes every time the page reloads / gets redirected.

window.onbeforeunload = function() {
  console.log("do something");}

I do not want this script to run during my tests. I want to disable it in my own test environment.

Is there some way to unbind this onbeforeunload event? I am using JavaScript, with jQuery as the framework, so an answer in jQuery would be good.

Answer 1

In javascript functions can be overwritten. You can simply assign it a new purpose:

window.onbeforeunload = function () {
  // blank function do nothing
}

This will completely overwrite the existing version of window.onbeforeunload.

Note: Why don't you simply remove the line of code that sets this function in the first place? Or if you can't, you will have to set this blank function after it is has been defined, just to make sure it is not overridden again

Answer 2

Not immediately related to this question, but may help someone nevertheless. This is what I use in Angular 1.x and TypeScript:

this.$window.onbeforeunload = () => undefined;

Answer 3

jQuery ≥ 1.7

With jQuery 1.7 onward the event API has been updated, .bind()/.unbind() are still available for backwards compatibility, but the preferred method is using the on()/off() functions. The below would now be,

$('#myimage').click(function() { return false; }); // Adds another click event
$('#myimage').off('click');
$('#myimage').on('click.mynamespace', function() { /* Do stuff */ });
$('#myimage').off('click.mynamespace');