如何解决在 Safari 上导航离开页面时显示加载指示器
我想在网站页面之间导航时显示漂亮的页面转换。
我尝试过使用以下事件:beforeunload unload pagehide
和 visibilitychange
。
有was a webkit bug描述为
visibilitychange:hidden 在页面导航期间不会触发
并列出了解决方法:
使用 pagehide 事件是解决方法
我正在为这些事件的 html 元素添加一个类。在 Chrome 和 Firefox 上,这会激活我的加载指示器类,并显示动画直到页面被替换。我在页面导航之间获得了很好的加载转换。因此,在 Chrome 和 Firefox 中,一切正常。
不幸的是,我在 iOS(iPhone 或 iPad)上的 Safari 没有任何运气,在 macOS Big Sur Safari 上也失败了。我在这里找到了一个相关的问题:Safari change dom on before unload page 然而,它只讨论了 beforeunload
事件。我希望通过在这里不那么具体,可以弹出一个可行的替代方案。
我已经通过手动应用在 Safari 上测试了 css 工作,并验证了我的侦听器是通过 javascript 控制台在 Safari 上调用的。但是似乎没有呈现 css 更改。在从服务器获取新页面响应之前,正在卸载的页面上没有显示转换。我还通过设置没有任何过渡或类似效果的简单背景颜色来验证它与正在使用的 CSS 无关。
到目前为止,我能够让 Safari 呈现 dom 更改的唯一方法是在卸载时返回一个真实的字符串 - 但这会提示用户是否要离开,这不是我的意图。
我想避免浏览器检测 - 但是我能想到的最后一个可行的替代方法是在检测到 Safari 以在导航之前启用加载指示器时扫描 dom 中的锚点、按钮、表单等。
还有其他选择吗?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。