Question

I understand from other posts that the only way to handle this is through a browser dialogue box that can’t be edited. What I am having a problem with is that box appearers no matter how I leave the page. The page has a save and delete button that are the correct ways to leave the page and I don’t want the dialogue box to appear for them.

Here is the JQuery I have

$(document).ready(function(){
//save or delete
  window.onbeforeunload = function() {
              var message = 'You have unsaved changes, please stay and save or delete them.';
              return message;
          }
}); 

and the save and delete button are:

  <a id='savenewscopesheet' class='taskbutton'>Save</a>
  <a id='deletenewscopesheet' class='taskbutton'>Delete</a>

I am using more JQuery to handle their function hence they don’t have an href.

Answer 1

Updated the code

$(document).ready(function(){
//save or delete

$('.taskbutton').click(function() {

    window.onbeforeunload = null;

    window.location='yourUrl'; //navigate to required page..

});

window.onbeforeunload = function() {
              var message = 'You have unsaved changes, please stay and save or delete them.';
              return message;
          }    



}); 

Try this..

http://jsfiddle.net/kabichill/px4ZU/