Question

I have an application which uses backbone hash routing. When the page reloads I use the onbeforeunload event to tell the user that there are unsaved changes and prevent the page load. This does not work on hash change; so if the user presses back the dialog does not tell them there are changes pending and just goes back.

Is there anyway to detect the hash change and prevent it happening? something like onbeforehashchange

Answer 1

Nope, you can detect the hashchange as it happens with something like below, but you can’t really detect it before it happens. If you need the hash before it changes you can just store it somewhere.

var myHash = document.location.hash;

$(document).on('hashchange', function() {
    if (myHash != document.location.hash) {
        //do something
    }
});

You can’t really detect the back button either, and if it does’nt trigger a reload, onbeforeunload won’t work either.

If this functionality is essential, you should consider trying the haschange plugin or the history plugin, as one of those would make this a lot easier, and let you control the browser history and back/forth.