Mobile Safari后退按钮

Sal*_*Sal 36 javascript safari

我发现的问题与这个问题非常相似,只是台式机上的Safari似乎已经解决了这个问题.基本上,问题是:当客户端浏览移动版Safari并且页面在pagea.html上执行javascript函数时,然后导航到pageb.html,然后按后退按钮返回pagea.html,javascript函数当客户端按下后退按钮返回pagea.html时,将不会运行.它将跳过javascript调用.

我已经尝试过上面链接中提到的解决方案,但似乎没有什么适用于移动Safari.还有其他人遇到过这个bug吗?你是怎么处理的呢?

Mik*_*ola 90

这是由后向缓存引起的.当用户导航时,它应该保存完整的页面状态.当用户使用后退按钮页面导航时,可以非常快速地从缓存加载.这与仅缓存HTML代码的普通缓存不同.

为bfcache onload事件加载页面时不会被触发.相反,您可以检查事件的persisted属性onpageshow.初始页面加载时设置为false.从bfcache加载页面时,它设置为true.

window.onpageshow = function(event) {
    if (event.persisted) {
        alert("From back / forward cache.");
    }
};
Run Code Online (Sandbox Code Playgroud)

出于某种原因,jQuery在事件中没有此属性.你可以从原始活动中找到它.

$(window).bind("pageshow", function(event) {
    if (event.originalEvent.persisted) {
      alert("From back / forward cache.");
    }
});
Run Code Online (Sandbox Code Playgroud)

这些问题的快速解决方案是在按下后退按钮时重新加载页面.然而,这会使后退/前进缓存所产生的任何积极影响无效.

window.onpageshow = function(event) {
    if (event.persisted) {
        window.location.reload() 
    }
};
Run Code Online (Sandbox Code Playgroud)

作为旁注,您可以看到很多页面提供使用空onunload处理程序作为解决方案.自从iOS5以来这没有用.

$(window).bind("unload", function() { });
Run Code Online (Sandbox Code Playgroud)

  • 对不起,但在OSX和Safari上这对我不起作用.event.persisted总是假的.难道我做错了什么? (7认同)
  • 应该注意的是,这个解决方案不再适用于当前版本的iOS(我相信我读到的地方超过了5).pageshow事件将为第一个后退/前进触发,并且永远不再针对该页面历史记录状态触发.我发现的唯一可行解决方案是利用popstate事件识别后退/前进. (4认同)
  • 这是一个空的 onunload 处理程序,自 iOS5 以来就不再工作了。上面的答案适用于iOS6。不过不确定iOS7。稍后会测试一下。 (2认同)
  • 据我所知,这在现代浏览器中不起作用。将代码插入到 `<head>` 和 `console.log()` 或 `alert()` 的 `event.persisted` 值中,它总是返回 false。在 Windows 上的 FF 54 和 Chrome 59 以及 iOS 10.3.2 上的 Safari 中进行了测试 - 不适用于其中任何一个。 (2认同)