I need to warn users about unsaved changes before they leave a page (a pretty common problem).

window.onbeforeunload = handler

This works but it raises a default dialog with an irritating standard message that wraps my own text. I need to either completely replace the standard message, so my text is clear, or (even better) replace the entire dialog with a modal dialog using jQuery.

So far I have failed and I haven’t found anyone else who seems to have an answer. Is it even possible?

Javascript in my page:

<script type="text/javascript">   
    window.onbeforeunload = closeIt;
</script>

The closeIt() function:

function closeIt()
{
  if (changes == "true" || files == "true")
  {
      return "Here you can append a custom message to the default dialog.";
  }
}

Using jQuery and jqModal I have tried this kind of thing (using a custom confirm dialog):

$(window).beforeunload(function () {
    confirm('new message: ' + this.href + ' !', this.href);
    return false;
});

which also doesn’t work – I cannot seem to bind to the beforeunload event.

12 Answers
12

Leave a Reply

Your email address will not be published. Required fields are marked *