回到使用ajax的pushState條目

Question

我遇到以下情況的問題。

1. 用戶訪問網站
2. 用戶點擊鏈接，使用history.pushState更新URL（使用jQuery）
3. 用戶點擊它加載了新的一頁
常規鏈接通過AJAX加載
4. 部分頁面內容
5. 用戶點擊回返回pushState的入口
6. 頁面現在只顯示頁面的部分，其通過AJAX檢索

我已經使用pushState爲各種事物加速了一個網站，結果是一個令人震驚的響應式Web應用程序，但是這個問題阻止了我使用它。

下面的代碼示例：

$('a').live('click', function(){ 
    history.pushState({}, '', this.href); 
    popstate(this.href); 
    return false; 
}); 

popstate = function(url){ 
    $('#content').load(url); 
} 
window.onpopstate = function(event){ 
    popstate(window.location.href); 
    event.preventDefault(); 
} 

注：

• 當它出現該事件是不是在步驟5觸發window.onpopstate功能放置警告這是一個錯誤？
• 僅當使用ajax時纔會出現此問題。
• 我不得不分開popstate函數，所以我可以在pushState後調用它。有沒有辦法手動觸發window.onpopstate事件？

Answer 1

似乎一些瀏覽器經常會混淆通過ajax加載的部分內容和整個頁面，並用它的佈局進行修飾。這是因爲他們都有相同的網址。 所以當用戶點擊後退按鈕時，瀏覽器不會加載URL，只會顯示之前通過ajax下載的部分。

爲了避免這種情況並保留兩個獨立的內部緩存（一個用於部分頁面，另一個用於整個頁面），當通過ajax調用時，您應該在URL中添加一個GET參數。像這樣在你的代碼：

popstate = function(url){ 
    $('#content').load(url+'?_ajax=1'); 
} 

希望這會有所幫助。