我可以防止history.popstate在初始頁面加載時觸發嗎？

我正在通過AJAX提供內容的網站上工作。我可以防止history.popstate在初始頁面加載時觸發嗎？

如果您單擊菜單中的某個項目，內容div會更新爲$.get響應，沒有什麼奇特的。

我正在實施history.pushState以允許使用瀏覽器的後退/前進按鈕導航。

我有以下載入歷史導航內容：

$(function() { 
    $(window).bind("popstate", function() { 
     $.getScript(location.href); 
    }); 
});

的問題是，當一個頁面加載的第一次，這個函數$.getScript所以頁面再次立即加載。第一次加載頁面呈現初始HTML視圖，然後在第二次加載時呈現JS視圖，因爲它是JS請求。

如何防止此事件發生在HTML請求頁面上？

來源

2011-03-06 jassa

注：history.popstate被調用一次 - 立即在第一頁的負荷：這是由設計。（在Chrome中檢查） –

使用你會碰到一些問題的原生HTML5歷史API，每個HTML5瀏覽器處理API有點不同，所以你不能只是一次編寫，並期望它沒有實施解決工作。 History.js爲HTML5歷史記錄API提供了一個跨瀏覽器API，如果您想沿着該路線繼續瀏覽，則爲HTML4瀏覽器提供可選的hashchange回退。

升級您的網站變成一個RIA/Ajax的應用程序，你可以使用這個代碼片段： https://github.com/browserstate/ajaxify

哪個是哪個進入約hashbang，哈希和HTML5歷史API說明較長的文章Intelligent State Handling的一部分。

讓我知道如果你需要任何進一步的幫助:)乾杯。

來源

2011-03-07 18:38:44 balupton

感謝您提及History.js。我正要將pushState實現到我們的框架中，並可能最終將我的頭髮撕掉。 – andrew

你自己的插件無恥的廣告... tsk tsk ...只是在開玩笑History.js現在拯救了我的生活（和大量的工作時間）在許多項目！ – Martin

即使hasherjs做得很好。它在我們現有的生產系統中運行非常好。 –

當瀏覽器第一次加載時，它總是觸發一個popstate事件。所以你需要確定這個popstate是不是你的。

當你做你的pushState時，確保你有一個狀態對象。這樣你可以稍後檢查它。

然後在popstate處理程序，檢查狀態對象:)

$(function() { 
    $(window).bind("popstate", function(data) { 
     if (data.state.isMine) 
      $.getScript(location.href); 
    }); 
}); 

// then add the state object 
history.pushState({isMine:true},title,url);

讓我知道如果你需要更多的幫助:)

來源

2011-03-06 13:37:04 sydlawrence

當popstate事件在頁面加載解僱也不會在事件對象中有一個狀態屬性。這使您可以檢查事件是否因頁面加載而被觸發。

window.onpopstate = function (event) { 
    if (event.state) { 
    // do your thing 
    } else { 
    // triggered by a page load 
    } 
}

來源

2011-03-07 14:24:16

正確：您可以使用：'if（!! event.state）'without'else' –

你需要得到event.originalEvent

// Somewhere in your previous code 
if (history && history.pushState) { 
    history.pushState({module:"leave"}, document.title, this.href); 
} 


$(window).bind("popstate", function(evt) { 
    var state = evt.originalEvent.state; 
    if (state && state.module === "leave") { 
    $.getScript(location.href); 
    } 
});

來源

2011-03-23 06:48:27 mech

這個工程令人驚訝！謝謝:) – James

不測試'history.pushState'的存在是否意味着'history'的存在？任何人都可以說爲什麼測試'history.pushState'是不夠的（用例）？ –

@OliverSchafeld只是看到了這一點。如果您嘗試引用「history」的屬性，但「history」不是對象，則會引發錯誤。因此，在嘗試使用（或檢查）其屬性之前，您必須驗證「歷史記錄」是否存在（並且是一個對象，如果您不確定的話）。 –

我用這個來改變吧ADRESS並保存當前狀態，包括當前的HTML身體，我重裝它背布頓點擊，沒有任何其他的AJAX調用。所有保存在您的瀏覽器：

$(document).ajaxComplete(function(ev, jqXHR, settings) { 

    var stateObj = { url: settings.url, innerhtml: document.body.innerHTML }; 
    window.history.pushState(stateObj, settings.url, settings.url); 
}); 


window.onpopstate = function (event) { 
    var currentState = history.state; 
    document.body.innerHTML = currentState.innerhtml; 
};

來源

2015-12-10 12:40:44 ghooz

我可以防止history.popstate在初始頁面加載時觸發嗎？

回答

相關問題