pushState and back button works but content doesn't change

Question

It does load a new page and the url does update, but when I press the back button, only the url has changed without refreshing but the content doesn't.

$('button').click(function(){
  window.history.pushState({}, '', 'page2.php');
  $('body').html('<div class="loading.gif"></div>');

  //Load Page
  $.get('page2.php', function(data){
    $('body').html(data);
  };

  //Edited 
  $(window).bind('popstate', function(){
    //What should I code here??
  });
});

Answer 1

I use this to change bar adress and save current state, including current html body, and i reload it on back bouton click without any other ajax call. All is saved in your browser :

1. $(document).ajaxComplete(function(ev, jqXHR, settings) {
   
       var stateObj = { url: settings.url, innerhtml: document.body.innerHTML };
       window.history.pushState(stateObj, settings.url, settings.url);
   });
   
   
   window.onpopstate = function (event) {
       var currentState = history.state;
       document.body.innerHTML = currentState.innerhtml;
   };