解决iphone safari下后退按钮导致函数不执行的问题
先还原问题,假设有两个页面A.htm(简写为A)和B.htm(简写为B),A部分代码如下:
1 2 3 4 | < div >< a href="B.html">跳转到B.htm</ a ></ div > < script type="text/javascript"> alert("小幻想,小幸福!"); </ script > |
B部分代码如下:
1 | < 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)有人给了回答,如
1 | window.onunload = function () {}; |
或是
1 | < iframe style="height:0px;width:0px;visibility:hidden" src="about:blank">this prevents back forward cache</ iframe > |
或是苹果官方的强制去除页面缓存的方法: 如何避免页面(和cookies)在Safari中被缓存
尝试过都不解决问题。问了几个同事,他们没遇到过这样的问题,也不知所措。问题还要解决,就只得依靠自己了。功夫不负苦心人,经过一番探究,终于想到了一个方法,代码如下,还是很简洁的
1 2 3 4 5 | $( "#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
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。
分类:
javascript
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南