Loading dynamically generated jQuery page after page reload

I have开发者_如何学C a search script written in jQuery. To submit a query a user presses enter and then a URL for the results page is created which is something like #search/QUERY/. However, when you either reload the page, click a result which goes to a different page or return back from a previous page the search results are no longer there. Why could this be?

My jQuery code is:

$(document).ready(function(){
    $("#search").keyup(function(e){
        if(e.keyCode==13){
            var search=$(this).val();
            var query=encodeURIComponent(search);
            var yt_url='search.php?q='+query;
            window.location.hash='search/'+query+'/';
            document.title=$(this).val()+" - My Search Script";
            $.ajax({
                type:"GET",
                url:yt_url,
                dataType:"html",
                success:function(response){
                    $("#result").html(response);
                }
            });
        }
    });
});

---

When a user reloads the javascript, all variables and functions are reinitialized. JavaScript does not pass variables from page to page. You either need a server side solution, or use JavaScript storage. The later may not work in all browsers.

---

This is because you are loading the search results dynamically with an AJAX call. If the page gets reloaded, that information gets lost.

A possible solution would be to store the search query and/or results in the user session. Then you will be able to automatically add the content on page reloads.