iOS Safari Mobile 不会仅触发一次页面显示触发

Posted 2023-02-23

【中文标题】iOS Safari Mobile 不会仅触发一次页面显示触发

【英文标题】：iOS Safari Mobile doesn't trigger pageshow firing only once

【发布时间】：2015-02-16 12:55:37

【问题描述】：

ios Safari 在以下情况下似乎不会触发 pageshow 事件。

假设我有 3 页

页面 A：（在 pageshow 事件中有一些代码） B 页 C页

用户从A -> B 导航。按下返回按钮。 （页面显示触发良好） 用户然后导航到另一个页面可能是页面 B 或页面 C。然后再次按下后退按钮。 （页面显示不触发）

相反，如果用户再次最小化和最大化窗口或切换到另一个窗口并返回（通过在 iPhone 上按中间按钮），则再次触发 pageshow 事件。

在 android 上似乎一切正常

window.onpageshow = function(e) 
  alert('hello');

还有其他人遇到过吗？我在这件事上花了几个小时，却想不出解决办法。

任何帮助将不胜感激。

【问题讨论】：

也许这个***.com/questions/11979156/mobile-safari-back-button的回答对你有帮助

***.com/questions/20899274/…

你解决了这个问题吗？我在 iOS 9.3 上遇到了同样的问题

@JorgeRamírez：是的，很久以前。我不记得了，但有两种不同的事件，一种在 Android 中运行良好，另一种在 iOS 中正常运行。一个是pageshow，另一个我不记得了。因此，基于 UserAgent，我将我的事件句柄添加到该事件中。试试pageinit、pagebeforeshow、pageshow 等。

感谢您的回复，但不幸的是，我已经尝试了所有这些活动，但没有任何运气

【参考方案1】：

Hack：这对我有用

var myCustomEvent = (navigator.userAgent.match('iPhone') != null) ? 'popstate' : 'pageshow';

$(window).on(myCustomEvent, function(e) 
 ...

由于某种原因，popstate 每次在 iOS 中页面状态发生变化时都会触发，而在 Android 中则不会。

【讨论】：

在测试了很多解决方案一段时间后，这段代码似乎终于成为了最终的解决方案，在我的情况下，它适用于 Safari 9.1 (iOS 9.3)。给面临这种情况的人的建议：一定要清除客户端上的浏览器缓存并在服务器上重新启动站点。

在 iOS 10 上像魅力一样工作！

【参考方案2】：

尝试使用：

window.onpageshow = function(event) 
if (!event.persisted) 
    alert("hello");

;

Persisted 在初始页面加载时为 false，因此您可以对其进行检查，如果为 false，则为您的第一个页面加载。

【参考方案3】：

popstate 事件似乎不再起作用，至少对我而言。我在我的页面上制定了一些第三方脚本破坏了这一点，但无法确定是哪一个。我想出了这个技巧：

addEventListener('pageshow', () => 
  history.replaceState(, document.title, window.location.pathname);
  // called on initial load and first back
);

addEventListener('popstate', () => 
  // called on all back events
);