popstate fire on page load

Question

$(window).on('popstate', function(){
    window.history.go(-1);
});

I have a page use popstate when user click back button

but in some browser, popstate fire on page load instead back button click.

it happen in Safari and touch device.

I think this will work for you. Click on [popstate-fire-on-page-load-issue][1]. [1]: http://stackoverflow.com/questions/15896434/window-onpopstate-on-page-load — Kushal Sharma, Jun 20 '14 at 07:45

score 1 · Answer 1 · answered Jun 20 '14 at 07:17

The easiest hack/solution, is to add the popstate listener right after the initial page load, in a setTimeout.

 setTimeout( function() {
    window.addEventListener( 'popstate', myPopStateHandler, false );
  }, 500 );

I’m weary of throwing a setTimeout in for a resolution, always seems like a kludge. But for now, hey it works.

marissajmc · Answer 2 · 2014-09-25T00:16:31.290

Adding a flag to detect page load fixed this for me.

Edit: added Safari browser detection, otherwise first click of back button won't trigger popstate event in Firefox or Chrome.

var isSafari = /^((?!chrome).)*safari/i.test(navigator.userAgent),
    firstLoad = true;
$(window).on('popstate', function(){
    if (isSafari && firstLoad) {
        firstLoad = false;
        return;
    } else {
        // run your popstate code
    }
});

popstate fire on page load

2 Answers2