History API: Javascript Pushstate, get previous URL

Question

$(window).bind('statechange',function(){
     var State = History.getState(),
     url = State.url;
});

In the following function, url returns the current URL. What I'm looking for is, within that function, to get the previous URL, so for example, if I'm on /cars/ferrari and go to /cars/ford, url would return cars/ford, but I want to get /cars/ferrari.

How do I get the previous URL within a statechange event?

Pattison

I would save the current url somewhere when you navigate via pushState. – Impassioned

Answer 1

$(window).bind('statechange',function(){
    // Prepare Variables
    var State = History.getState(),
        url = State.url,
        states = History.savedStates,
        prevUrlIndex = states.length - 2,
        prevUrl = states[prevUrlIndex].hash;
});

That seems to do the trick! prevUrl gives me the desired URL.

Pattison

This requires History.js, yes? – Impassioned

$(window).bind('statechange') doesn't seem to trigger anything for me – Nicotiana

Answer 2

All I would do is push the URL on to the state object so you can get it back again.

So this when you use pushState :

history.pushState(
  {'previous_url': document.location.href}, 
  document.title,
  "?some_query_string"
);

Then when you get the state it will have previous_url on it :)

Godfearing

Answer 3

Try this:

alert(document.referrer);

Note:

The value is an empty string if the user navigated to the page directly (not through a link, but, for example, via a bookmark). Since this property returns only a string, it does not give you DOM access to the referring page.

See more here: https://developer.mozilla.org/en-US/docs/DOM/document.referrer?redirectlocale=en-US&redirectslug=document.referrer

Cheryl