update ajax on browsers back & refresh button is trigger

update ajax on browsers back & refresh button is trigger

Its my first web application building with jsp , jstl using ajax as to make music player play throughout the site. i have many ajax req in single page . when i click on that its works all fine but when ever i refresh it takes me to blank content page in this code "Djpage.jsp" with out any content as requested in ajax i know as for url it will show but i researched a lot and tried but its not working and when i click button it does not respond only url is changed .

Need help and explanation how do i achieve this -

  1. Show ajax data whenever refresh button is trigger.
  2. Forward and backward button should work and show the ajax content.

Hope you get My problem

Below is on of my ajax req code -


  1. $('li.box').on('click', function(){
  2.        
  3.       $(this).children("form").submit();
  4.          var Djform =  $(this).children("form");
  5.         var url = 'Djpage.jsp';
  6.         var Djname = $(Djform).children('input[type=hidden][name=inputName]').val();
  7.         $.get(url,{inputName:Djname},function(data){
  8.                     $("#cssSlider").hide();
  9.                   $("#tabscontainer").hide();
  10.                
  11.                $("#dj_loard").html(data);
  12.                   $("#dj_loard").show();
  13.                    var newTitle = $(data).filter('title').text();
  14.                    document.title = newTitle;
  15.                     window.history.pushState("",null, url);
  16.                         
  17.             
  18.         });
  19.     
  20.         
  21.     
  22. });