Jquery DOM 准备就绪 - 不是每次都在 iphone 5 (ios7) 上的 Safari 中加载

Posted 2023-05-09

技术标签:

【中文标题】Jquery DOM 准备就绪 - 不是每次都在 iphone 5 (ios7) 上的 Safari 中加载【英文标题】：Jquery DOM ready - doesn't load everytime in Safari on iphone 5 (ios7) 【发布时间】：2014-02-15 00:15:36 【问题描述】：

我有一个带有 Bootstrap 3 的 Rails 4 应用程序，并注意到每次在我的 iphone 5 或 ipad mini（均为 ios 7）的 safari 浏览器中加载页面时，不会执行 .ready() 的 jQuery 处理程序，而它是在两个设备的 chrome 浏览器中。相反，处理程序仅在应用程序最初加载到我的 iOS 设备上的 Safari 时执行，但仅此而已......它不会再次执行处理程序。此外，每次在我的笔记本电脑上的 Chrome、Firefox 和 Safari 浏览器中加载页面时，也会执行该处理程序。有人可以解释我如何让 Safari 每次在 iOS 设备上加载页面时执行 .ready() 处理程序。代码如下：

$(function() 
  alert("DOM is ready");
);

这显然是一个微不足道的例子，但我遇到了 jQuery 函数无法一致执行的问题，我相信这就是原因。

【问题讨论】：

【参考方案1】：

Jquery 和 turbolinks 不能很好地配合使用。在 Safari Mobile 上，DOM 就绪事件仅在初始页面上触发，并且在我单击我的网站时不会再次触发。原因是 turbolinks，这里有一篇关于使用 page:change 事件来解决问题的好文章：

http://geekmonkey.org/articles/28-introducing-turbolinks-for-rails-4-0

使用上面的解决方案，我得到了一些工作，但当我使用浏览器上的后退按钮时，我也得到了一些事件的多个绑定。

在我看来，更好的解决方案是改用 jquery.turbolinks gem。这里有两篇关于这个主题的好文章：

http://blog.joshsoftware.com/2013/06/28/troubleshooting-turbolinks-with-rails-4/

https://github.com/kossnocorp/jquery.turbolinks

安装 gem 后，我不再使用 page:change 事件，一切似乎都在工作。如果您确实安装了 gem，请密切注意如何配置 javascript 清单文件 (application.js)。全部在https://github.com/kossnocorp/jquery.turbolinks中指定。

希望这会有所帮助！

【讨论】：

【参考方案2】：

看起来 javascript 根本没有在页面上执行。在iOS 上，当您在浏览器中点击后退箭头时会发生这种情况。它有一个流行的解决方案：

在 html onunload 属性中添加 body 标签，如下所示：