Is there a callback for History.pushstate?

thekevinscott picture thekevinscott · May 2, 2012 · Viewed 13.1k times · Source

My Google-fu pulls up nothing.

When you do this:

var stateObj = { state: "some state" };
history.pushState(stateObj, "page 2", "other.htm");

Is there an associated window callback?

I know that there's this:

window.onpopstate = function() {

}

Which works great for listening to when a user hits the back button. However, I want to listen to any time the URL changes at all, and I'm not sure how to do it.

Is there a global callback for anytime the URL changes?

Answer

Peter C picture Peter C · May 2, 2012

No, there's not a onpushstate or whatever. However, a little monkey patching can fix that:

var pushState = history.pushState;
history.pushState = function () {
    pushState.apply(history, arguments);
    fireEvents('pushState', arguments);  // Some event-handling function
};

This will only notify you when pushState is used. You'd probably want to do something similar for replaceState.

If you need to be notified whenever the URL changes at all, some combination of the above and a hashchange handler will get you most of the way there.