Search code examples
javascriptjqueryscrolltoppage-refreshhtml5-history

Refresh page once when popstate is fired?


I have a long page which navigates via scrollTop().

Because scrollTop() doesn't work propperly with back buttons of browsers (the browsers ignore it) I want to try and refresh the browser on every popstate, then it would work and the users scroll position would be where its supposed to be.

Problem is my code results in infinite refresh.

    $(window).bind('popstate', function(event) {
        //var path = window.location.pathname;
        //var filename = path.match(/.*\/([^/]+)\.([^?]+)/i)[1];
        //var pos = "#" + filename;
        //$(document).scrollTop(pos);
        location.reload();
    });

How can I fix it to refresh only once? I tried one() but its the same.


Solution

  • There are lots of jQuery and plain JS plugins for browser history, that will do what you want.
    I don't think refreshing page will enable browser history for you.

    jQuery BBQ:
    http://benalman.com/projects/jquery-bbq-plugin/
    demo:
    http://benalman.com/code/projects/jquery-bbq/examples/fragment-basic/#chicken.html

    History JS
    https://github.com/browserstate/history.js/