Popstate not working as expected(needs multiple clicks)

I am trying to learn History Web API, but already have problems at the first hurdle.

I am able to get history.pushState working, but have issues with popstate. It works fine when clicked for the first time after AJAX page load, but if I load that same page again, I need to click back button twice. If I load it one more time, I need to click back three times, and so on.

Here is my code:

$(function(){
var $main = $('#main');


$(window).on('popstate', function () {
    loadPage(location.href); 
});

$(document).on('click', 'a', function(){
    var href = $(this).attr('href');
    history.pushState({}, '', href);
    loadPage(href);
    return false;
})

loadPage = function(href){
    $main.load(href);
}
})

Answers:

Answer

You need the state Object. In your case you using a empty Object wich will not work proberly. Just test is with a Object like this : {"url":yourUrlVar}

Reference: History.pushState - MDN

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.