javascript javascript設定 Safari後退按鈕問題




safari javascript設定 (8)

一個iframe解決了這個問題:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><title>Safari Back Button Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body onload="alert('Hello');">
<a href="http://www.codinghorror.com">Coding Horror</a>
<iframe style="height:0px;width:0px;visibility:hidden" src="about:blank">
this prevents back forward cache
</iframe>
</body>
</html>

更多細節

我為當地社區學院做了一些小規模的編程和網絡工作。 包括維護一個非常大的和靈魂破壞的網站,包括VBScript,javascript,Dreamweaver生成的cruft和各種conmen已經說服他們購買多年的附加組件集合的工作。

幾天前,我接到一個電話:“網站正在鎖定使用Safari的人!” 好吧,第一步下載Safari(v3.1.2),第二步網站衝浪。 一切似乎正常工作。

長話短說我終於孤立了這個問題,它涉及到Safari的後退按鈕。 該網站使用一個花式褲子的JavaScript菜單,在我嘗試過的所有瀏覽器中都有效,包括第一次使用Safari。 但是在Safari中,如果您關閉頁面的鏈接,然後點擊後退按鈕,菜單將不再起作用。

我做了一個削減的網頁來說明原則。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head><title>Safari Back Button Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body onload="alert('Hello');">
<a href="http://www.codinghorror.com">Coding Horror</a>
</body>
</html>

加載頁面,你會看到警告框。 然後按照頁面上的鏈接並點擊後退按鈕。 在IE和Firefox中,你再次看到警告框,在Safari中你不知道。

經過大量的搜索,我發現了其他類似的問題,但沒有真正令人滿意的答案。 所以我的問題是,如何讓我的網頁在用戶點擊後退按鈕後在Safari中以同樣的方式工作,就像他們在其他瀏覽器中一樣?

如果這是一個愚蠢的問題,請溫柔,JavaScript對我來說有點新。


在iPad上有同樣的問題。

不是那麼漂亮,但它的作品:)。 怎麼運行的。

我意識到,在iPad Safari上,按下後退按鈕後,頁面不會重新加載。 我在頁面上每秒都放一個計數器,並保存當前的時間戳。

當頁面加載時,計數器和時間是同步的。 在返回按鈕上,計數器繼續停止,並在時間戳和計數器之間存在差距。 如果間隙大於500毫秒,強制重新加載頁面。

在文件action.js中

var showLoadingBoxSetIntervalVar;
var showLoadingBoxCount = 0;
var showLoadingBoxLoadedTimestamp = 0

function showLoadingBox(text) {

    var showLoadingBoxSetIntervalVar=self.setInterval(function(){showLoadingBoxIpadRelaod()},1000);
    showLoadingBoxCount = 0
    showLoadingBoxLoadedTimestamp = new Date().getTime();

    //Here load the spinner

}

function showLoadingBoxIpadRelaod()
{
    //Calculate difference between now and page loaded time minus threshold 500ms
    var diffTime = ( (new Date().getTime()) - showLoadingBoxLoadedTimestamp - 500)/1000;

    showLoadingBoxCount = showLoadingBoxCount + 1;
    var isiPad = navigator.userAgent.match(/iPad/i) != null;

    if(diffTime > showLoadingBoxCount && isiPad){
        location.reload();
    }
}

$(window).bind("pageshow", function(event) {
  if (event.originalEvent.persisted) {
    window.location.reload() 
  }
});

mshah最近在這裡 回复 。


請不要遵循任何告訴您忽略緩存的建議。 頁面緩存的原因 - 提高用戶體驗。 您使用的方法會使用戶體驗變差,所以除非您討厭用戶,否則不要那麼做。

Safari(桌面和iOS)的正確解決方案是使用pageshow事件,而不是onload事件(請參閱https://developer.mozilla.org/en-US/docs/Using_Firefox_1.5_caching )。

pageshow事件將在您期望onload事件觸發的同時觸發,但是在通過緩存提供頁面時也會起作用。 這似乎是你想要的。


我發現了一些非常相似的東西。 我認為這是因為Firefox和IE在回去的時候再次從服務器上獲取頁面,而Safari則沒有。 你嘗試添加頁面過期/沒有緩存頭? 當我發現行為但還沒有時間的時候,我會去查看它。


我不知道是什麼原因造成這個問題,但是我知道誰可能會幫助你。 Safari是建立在Webkit上的 ,並且不是蘋果公司(誰不是那麼關注社區), Webkit團隊可能知道問題在哪裡。

這根本不是一個愚蠢的問題。


把這個放在body標籤<body onunload="">

這將強制Safari瀏覽器,鉻,FF每次你點擊後退按鈕重新加載


Stefan的iframe解決方案,但如果這不夠優雅,我發現以下的JavaScript也解決了它:

window.onunload = function(){};

也就是說,如果你的菜單是JavaScript,那麼你可能更喜歡用JavaScript解決這個問題。

卸載事件處理程序定義的想法來自這個Firefox 1.5的文章: https//developer.mozilla.org/en/Using_Firefox_1.5_caching





safari