JQuery Mobile，交替圖像打破「返回」按鈕

Question

對於JQuery Mobile網站，我需要一個新的圖像加載頁面導航。該圖像僅顯示在主屏幕上。

因此，例如，您加載了m.smellyeggs.com，它將image_A.png作爲頂部橫幅。您選擇菜單項1，然後向後按，現在image_B.jpg顯示爲頂部橫幅。

我能夠使用cookies得到它的工作。我得到一組潛在的圖像，然後使用cookie來遍歷數組。這適用於頁面重新加載，但任何緩存加載頁面（例如href =「/」或在移動設備或瀏覽器中使用「Back」）都不會調用JavaScript。因此圖像不會實際交替。

var images = new Array(); 
<% banner_mobile_uris(controller.conference).each do |url| %> 
    images.push("<%= url %>"); 
<% end %> 

inc_banner_cookie(); 
load_banner(); 

要解決這個問題，我使用下面的代碼，它刪除圖像，每當主頁加載時強制圖像刷新。

$('a').live('click', function(ev){ 
    var banner = $('#m_banner').load(htm_file); 
    banner.empty().remove(); 
}); 

此代碼從任何後續頁面導航中刪除「返回」按鈕。

那麼這是不可接受的！任何關於更好方法的建議？我寧願不實施我自己的「後退」按鈕，除非這是絕對必要的。

感謝您的閱讀（並希望有所幫助）。

Answer 1

答案在於使用pageinit檢測成功jQuery Mobile的頁面加載...

$(document).on('pageinit', function(){ 
    inc_banner_cookie(); 
    load_banner(); 
}); 

這不會禁用後退按鈕。並導致圖像重新加載任何類型的頁面導航。幾乎任何類型的...

事實證明，這個appraoch是脆弱的，當AJAX重定向發生時，隨後的pageinits可能無法正常工作。請參閱my question concerning this issue.