Loading dynamically generated content after page reload
I have a Google Instant style search script written in jQuery. When a user searches, a URL is created which is something like #search/QUERY/1/. 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(){
var search=$(this).val();
var query=encodeURIComponent(search);
var yt_url='search.php?q='+query+'&category=web';
window.location.hash='search/'+query+'/1/';
document.title=$(this).val()+" - My Search Script";
if(search==''){
window.location.hash='';
document.title='My Search Script';
}
$.ajax({
t开发者_StackOverflow中文版ype:"GET",
url:yt_url,
dataType:"html",
success:function(response){
if(response !=""){
$("#result").html(response);
} else {
$("#result").html("No results were found.");
}
}
});
});
});
$(document).ready(function(){
/// Your original key up here...
// With browser's back you should get your hash back, so you should be
// able to fill in the query value back and simulate key release to trigger search
if(window.location.hash.indexOf('#search/') == 0) {
query = window.location.hash.replace('#search/', '').replace('/1/', '');
$('#search').val(decodeURIComponent(query)).keyup();
}
});
Because its return to the previous state of the page before the search.
Maybe this can be a workaround:
$(document).ready(function(){
/*
your code here
*/
if ($("#search").val() != "")
$("#search").keyup();
});
So it will mimic the behavior of when the user is searching when the page reloads, return back, etc..
精彩评论