Ajax Загрузить всю страницу истории "onpopsate"

Question

Я использую это для создания нового состояния:

//state 1
        history.pushState({ reload: true }, 'submodulo', '?submodulo=1');
//state2
        history.pushState({ reload: true }, 'submodulo', '?submodulo=2');
//state3
        history.pushState({ reload: true }, 'submodulo', '?submodulo=3');

Я хочу перезагрузить контент, когда пользователь нажмет кнопку "Назад".

window.onpopstate = function(event) {
          if (event.state !== null && event.state.reload) {

              location.reload(true);

            }               
    };

Но, таким образом, я потеряю штаты. Это как щелкнуть по целому новому URL. Это не сохраняет последовательность. Есть ли другой способ загрузить всю страницу, но с помощью AJAX?

Answer 1

Вам нужно запустить AJAX-вызов вместо перезагрузки страницы в событии popstate.

window.onpopstate = function(event) {
   if (event.state !== null && event.state.reload) {
              $.ajax({
                url: 'load-content.php',
                success: function( response ) {
                     $('#main-content').replaceWith( response );      
                  }
              });
   }               
};

В целевой файл PHP загрузите ваш контент в зависимости от URL-адреса или заданных параметров и в случае успеха замените его на сгенерированный.