如何使用 Rails 4 和 Turbo-Links 修复 jQuery 的'ready”事件失败？

Rails 4 中使用 Turbo-Links 的 DOM 事件处理

初始页面加载后 jQuery 的“Ready”事件未触发？

对于 Rails 4 应用程序实现资产管道，就产生了管理JS组织的需求。由于 Turbo-Links，用户可能会遇到 jQuery 的就绪事件在后续链接点击时无法触发的问题。

了解 Turbo-Links 的影响

Turbo-Links 通过执行页面转换而不需要完整的页面转换来增强导航功能重新加载。此优化可防止在第一个页面加载后触发就绪事件，因为后续链接单击只会更新页面的内容。

解决问题

为了确保 jQuery 事件与 Turbo-Links 无缝运行，建议使用以下方法：

CoffeeScript 版本

ready = ->
  # Place your CoffeeScript code here
$(document).ready(ready)
$(document).on('page:load', ready)

'page:load'事件由 Turbo-Links 触发，并为就绪事件提供可靠的替代。

JavaScript 版本

var ready;
ready = function() {
  # Insert your JavaScript code here
};
$(document).ready(ready);
$(document).on('page:load', ready);

Rails 5 更新

对于 Rails 5，Turbo-Links 5 包括一个turbolinks:load 事件，该事件在初始和后续页面加载时触发。这简化了解决方案：

$(document).on('turbolinks:load', function() {
  # Add your JavaScript code here
});

通过实施此方法，jQuery 事件将在利用 Turbo-Links 的 Rails 4 应用程序中按预期执行。

以上是如何使用 Rails 4 和 Turbo-Links 修复 jQuery 的'ready”事件失败？的详细内容。更多信息请关注PHP中文网其他相关文章！