そのため、特定のコンテンツを に表示するのに役立つ URL ハッシュを使用していますhashchange
。特定のコンテンツを表示していて、ページ全体を更新すると、URL にそのハッシュが含まれていても、そのハッシュによって示されるコンテンツを取得できません。
私の URL が :
http://localhost/user
であるとします。詳細をクリックすると、URL が次のようになりまし
http://localhost/user#!details
た。詳細ページが表示されます。
しかし、ページをリロードするときに上記を私のURLとして持つと、ハッシュは同じままで、hashchangeイベントでバインドした関数を呼び出さないハッシュに変更はありません。
また、ユーザーが を使用してリロードするたびに ajax リクエストを送信しないと、サーバー側にハッシュを取得できませんbeforeunload
。
助言がありますか?
私のコード:
var pages = {};
pages['home'] = ""; pages['details'] = ""; pages['reviews'] = ""; pages['favs'] = "";
pages['likes'] = "", pages['gallery'] = "", pages['visited'] = "", pages['coupons'] = "";
$(window).bind('hashchange', function(event) {
var curr_hash = event.target.location.hash;
var page_to_load = curr_hash.substr(2);
var loadurl = "/ci_theyaw/user/user_" + page_to_load;
load_page(loadurl, page_to_load);
});
function load_page(page, toload){
// alert(pages[toload]);
if(pages[toload] == "") {
var post_data = {
'<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>'
};
$.ajax({
type: 'POST',
url: page,
data: post_data,
dataType: "html",
success : function(data) {
page[toload] = data;
$('.right-pane').html(data);
},
error : function(xhr, ajaxOptions, thrownError){
alert(xhr.status);
console.log(xhr.responseText);
alert(thrownError);
}
});
}
else {
$('.right-pane').html(page[toload]);
}
}