解決iphone safari下后退按鈕導致函數不執行的問題

先還原問題，假設有兩個頁面A.htm（簡寫為A）和B.htm（簡寫為B），A部分代碼如下：

<div><a href="B.html">跳轉到B.htm</a></div>
<script type="text/javascript">
alert("小幻想，小幸福！");
</script>

B部分代碼如下：

<div><a id="backPrev" href="javascript:history.go(-1);">返回</a></div>

在iphone safari瀏覽器下，第一次打開A，會彈出alert。點擊A中的鏈接，跳轉到B，當點擊B中的【返回】按鈕，跳轉到A，A中的alert就不會彈出，而android下的瀏覽器，pc的safari、chrome等瀏覽器都會執行，這就讓我陷入了困惑。google后，發現有人也遇到同樣的問題，SO(stackoverflow.com)有人給了回答，如

window.onunload = function() {};

或是

<iframe style="height:0px;width:0px;visibility:hidden" src="about:blank">this prevents back forward cache</iframe>

或是蘋果官方的強制去除頁面緩存的方法： 如何避免頁面（和cookies）在Safari中被緩存 

嘗試過都不解決問題。問了幾個同事，他們沒遇到過這樣的問題，也不知所措。問題還要解決，就只得依靠自己了。功夫不負苦心人，經過一番探究，終於想到了一個方法，代碼如下，還是很簡潔的

$("#backPrev").attr("href","javascript:void(0);").click(function(){
	if (/(iPhone|iPad|iPod)/i.test(navigator.userAgent)) {             
        	window.location.href = window.document.referrer;
	} else { window.history.go("-1"); }
});

這樣問題就解決拉。如是大家對 document.referrer 不熟悉，請參考：https://developer.mozilla.org/en/DOM/document.referrer

---end

作者：清流魚

出處：http://www.cnblogs.com/qingliuyu/

新浪微博：http://weibo.com/qingliuyu

本文版權歸作者和博客園共有,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文連接。