Popstate - passing popped state to event handler

Question

The following code should cause an alert of '1', but instead does nothing.

window.onpopstate = function(event) { alert(event.state.a) }
history.pushState({a: 1})
history.back()

Fiddle: http://jsfiddle.net/WNurW/2/

Any ideas?

Answer 1

Your code woudn't cause a popstate, as the pushstate command tells what page you are on NOW.

window.onpopstate = function(event) { alert(event.state.a) }
history.pushState({a: 1});
history.pushState({a: 2});
history.back()

The above code will work.
Heres the fiddle: http://jsfiddle.net/WNurW/8/

As you can see on the above picture:
(1) Here you entered the page, or the fiddle, you then want to pushState, which will add a new link to the history chain.

(2) When you push state, you will add one more back click to the history, but it will also move the current place in "history" up to your new state. So going back, will not give you the history state you think you are getting, it will give the previous one.

(3) You have to go to a "new" page, or push another history state, to be able to go back to the state you created in step (2).