я пробую API истории HTML5 с ajax-загрузкой контента.

У нас есть куча тестовых страниц, связанных относительными ссылками. У меня есть этот JS, который обрабатывает клики по этим ссылкам. При нажатии на ссылку обработчик получает свой атрибут href и передает его в ajaxLoadPage (), который загружает контент с запрошенной страницы в область содержимого текущей страницы. (Мои PHP-страницы настроены на возврат полной HTML-страницы, если вы запрашиваете их в обычном порядке, но только к фрагменту содержимого, если к фрагменту запроса добавлен фрагмент? True.)

Затем мой обработчик кликов вызывает history.pushState (), чтобы отобразить URL-адрес в адресной строке и добавить его в историю браузера.

$(document).ready(function(){

    var content = $('#content');

    var ajaxLoadPage = function (url) {
        console.log('Loading ' + url + ' fragment');
        content.load(url + '?fragment=true');
    }

    // Handle click event of all links with href not starting with http, https or #
    $('a').not('[href^=http], [href^=https], [href^=#]').on('click', function(e){

        e.preventDefault();
        var href = $(this).attr('href');
        ajaxLoadPage(href);
        history.pushState({page:href}, null, href);

    });

    // This mostly works - only problem is when popstate happens and state is null
    // e.g. when we try to go back to the initial page we loaded normally
    $(window).bind('popstate', function(event){
        console.log('Popstate');
        var state = event.originalEvent.state;
        console.log(state);
        if (state !== null) {
            if (state.page !== undefined) {
                ajaxLoadPage(state.page);
            }
        }
    });

});

Когда вы добавляете URL-адреса в историю с помощью pushState, вам также необходимо включить обработчик событий для события popstate, чтобы обрабатывать нажатия на кнопки «назад» или «вперед». (Если вы неЧтобы сделать это, при нажатии назад отобразится URL, который вы добавили в историю в адресной строке, но страница не отображается.t обновлено.) Таким образом, мой обработчик popstate получает URL-адрес, сохраненный в свойстве состояния каждой созданной мной записи, и передает его в ajaxLoadPage для загрузки соответствующего содержимого.

Это работает нормально для страниц, которые мой обработчик кликов добавил в историю. Но что происходит со страницами, которые браузер добавил в историю, когда я их запрашивал?обычно"? Скажем, я нормально захожу на свою первую страницу, а затем перемещаюсь по моему сайту с помощью кликов, которые выполняют загрузку AJAX - если я затем пытаюсь вернуться к истории на этой первой странице, последний щелчок показывает URL для первой страницы, но не 'Загрузите страницу в браузере. Это почему?

Я могу видеть, что это как-то связано со свойством состояния последнего события popstate. Свойство состояния для этого события равно нулю, потому чтоТолько записи, добавленные в историю с помощью pushState () или replaceState (), которые могут дать ему значение. Но моя первая загрузка страницы была "нормальный" запрос - почему браузер непросто сделать шаг назад и загрузить исходный URL нормально?