解决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;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

本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。