onpageshow事件和onload事件。 onpageshow 事件類似于 onload 事件,onload 事件在頁面第一次加載時觸發, onpageshow 事件在每次加載頁面時觸發,即 onload 事件在頁面從瀏覽器緩存中讀取時不觸發。
為了查看頁面是直接從服務器上載入還是從緩存中讀取,你可以使用 PageTransitionEvent 對象的 persisted 屬性來判斷。 如果頁面從瀏覽器的緩存中讀取該屬性返回 ture,否則返回 false
解決方案
通過onload方式
代碼如下:
頁面中寫一個隱藏的input
input type= hidden id= refreshed value= no
js操作如下
onload=function(){ var refreshedId=document.getElementById( refreshed if(refreshedId.value== no ){ refreshedId.value= yes } else{ refreshedId.value= no location.reload(); }
通過onpageshow 方式
這種方式在電腦上是沒有問題的,但是蘋果safari中返回不執行onload事件,要用如下方式:
window.onpageshow = function(event) { if (event.persisted) { window.location.reload() };
通過實際操作發現,event.persisted在電腦中一直是返回false,但是在手機safari中是沒有問題的。
綜合解決方案
因此,可以如下寫代碼:
if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) { window.onpageshow = function(event) { if (event.persisted) { window.location.reload() }else{ onload=function(){ var refreshedId=document.getElementById( refreshed if(refreshedId.value== no ){ refreshedId.value= yes } else{ refreshedId.value= no location.reload(); }
通過上面代碼發現在safari中第一次打開頁面的時候,有時候會出現閃屏效果。
添加如下代碼:
$(window).bind( unload , function() { });
就沒有再出現閃屏效果了。
通過iframe方式阻止緩存
頁面中添加如下代碼
iframe >這種方式有待驗證。
通過時間戳強制刷新方式
下面代碼是針對iPad中safari返回按鈕問題
var showLoadingBoxSetIntervalVar;var showLoadingBoxCount = 0;var showLoadingBoxLoadedTimestamp = 0function showLoadingBox(text) { var showLoadingBoxSetIntervalVar=self.setInterval(function(){showLoadingBoxIpadRelaod()},1000); showLoadingBoxCount = 0 showLoadingBoxLoadedTimestamp = new Date().getTime(); //Here load the spinnerfunction showLoadingBoxIpadRelaod() //計算時間超過500毫秒 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();}相信看了這些案例你已經掌握了方法,更多精彩請關注php 其它相關文章!
相關閱讀:
CSS的編碼怎么轉換
css3點擊顯示漣漪特效
怎樣用canvas做出粒子噴泉動畫的效果
以上就是點擊瀏覽器的返回按鈕,就會刷新歷史頁面這個問題的解決方案的詳細內容,html教程
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。
新聞熱點
疑難解答
圖片精選