在 Rails 中使用 Turbolinks 5 时，我应该如何处理页面元素上的事件侦听器？

Question

根据 Turbolinks readme，我们不应该在使用 turbolinks:load 时直接在页面元素上设置事件侦听器：

When possible, avoid using the turbolinks:load event to add event listeners directly to elements on the page body. Instead, consider using event delegation to register event listeners once on document or window.

既然如此，有时您需要在各个元素上设置侦听器。推荐的方法是什么？使用不同的 Turbolinks 事件？还有别的吗？

Answer 1

如果事件是由用户触发的（点击、按键等），那么您可以简单地使用

$(document).on('click', '#id', function(e) {......

它工作正常，因为它绑定到文档而不是可以更改或删除的 class/id。尽可能使用它。

如果您在页面加载时需要一些东西，那么您必须像下面那样使用 turbolinks:load。你需要这个，因为使用 turbolinks 你不需要真正的整页重新加载，但你必须以某种方式告诉浏览器，你已经在不同的页面上了。

$(document).on('turbolinks:load', function() {
  $('.class').geocomplete();
});

在 Rails 中使用 Turbolinks 5 时，我应该如何处理页面元素上的事件侦听器？

How should I handle event listeners on page elements when using Turbolinks 5 in Rails?

ruby-on-rails

turbolinks