帶后退和前進按鈕的history.pushState

Question

我需要使前進和后退按鈕與此ajax方法一起使用
此代碼可以正常工作，並且瀏覽器上的URL應當按原樣進行更改
但是當您單擊后退和前進按鈕時，沒有任何反應

(function(){

    function clickNav(e){
        e.preventDefault();
        var href = $(this).attr('href');
        history.pushState(null, null, href);

        $.ajax({
            url: href,
            dataType: 'html',
            cache: false
        }).done(function(html){
            var $html = $(html);

            $('title').html($html.filter('title').text());
            $('#content').replaceWith($html.find('#content'));
            $('#nav').replaceWith($html.find('#nav'));

            $('#nav li a').on('click',clickNav);
        });

    }
    $('#nav li a').on('click',clickNav);

})();

Answer 1

我今天不得不處理這個。 以下對我有用（到目前為止，已在Win 7的四個瀏覽器上進行了測試）...

//CHECK FOR ADDRESS BAR CHANGE EVERY 500ms
var wwcint = window.setInterval(function(){
    if(window.last_location_href == undefined) {
        window.last_location_href = document.location.href;
    } else if(window.last_location_href != document.location.href) {
        window.last_location_href = document.location.href;

        //DO WHATEVER YOU NEED TO DO TO LOAD THE CORRECT CONTENT
        someFunctionToLoadTheContent(document.location.href);
    }
}, 500);

Answer 2

這是因為您的歷史記錄是空的。 為此，您需要使用

 history.pushState();

之后，我的按鈕開始工作