Возвращаясь к записи pushState, которая использовала ajax

У меня возникла проблема со следующей ситуацией.

  • Пользователь посещает сайт
  • Пользователь нажимает ссылку, которая использует history.pushState для обновления URL
  • Содержимое частичной страницы, загруженное через ajax (с использованием jQuery)
  • Пользователь нажимает на регулярную ссылку, которая загружает новую страницу
  • Пользователь щелкает назад, чтобы вернуться к записи pushState.
  • На странице теперь отображается только часть страницы, полученная с помощью ajax

Я использовал сайт pushState для разных вещей, и результат - потрясающе отзывчивое веб-приложение, но эта проблема мешает мне использовать это.

Вот пример кода:

$('a').live('click', function(){
  history.pushState({}, '', this.href);
  popstate(this.href);
  return false;
});

popstate = function(url){
  $('#content').load(url);
}
window.onpopstate = function(event){
  popstate(window.location.href);
  event.preventDefault();
}

Примечания:

  • При размещении предупреждения в функции window.onpopstate появляется, что событие НЕ запускается на шаге 5. Является ли это ошибкой?
  • Проблема возникает только при использовании ajax.
  • Мне пришлось отделить функцию popstate, чтобы я мог вызвать ее после pushState. Есть ли способ вручную запустить событие window.onpopstate?

Ответ 1

Кажется, что некоторые браузеры часто путают частичную загрузку через ajax и всю страницу, украшенную ее макетом. Это потому, что они оба имеют одинаковый URL. Поэтому, когда пользователь нажимает кнопку "Назад", браузер не загружает URL-адрес и просто отображает частичное, которое он ранее загружал через ajax.

Чтобы избежать этого и поддерживать два отдельных внутренних кэша (один для частичной страницы и один для всей страницы), вы должны добавить параметр GET в URL-адрес при вызове через ajax. Как это в вашем коде:

popstate = function(url){
  $('#content').load(url+'?_ajax=1');
}

Надеюсь, что это поможет.