Rails4:如何使用$(document).ready()和turbo-links

Question

我在尝试“以Rails的方式”组织JS文件时遇到了Rails4应用程序中的一个问题。他们以前分散在不同的观点。我将它们组织到单独的文件中，并用资产管道编译它们。但是，我刚刚了解到，当turbo-linking被打开时，jQuery的“ready”事件不会在随后的点击时触发。当你第一次加载一个页面时，它就可以工作了。但是当您单击一个链接时，ready(function($){中的任何内容都不会被执行（因为页面实际上不会再次加载）。

所以我的问题是：什么是正确的方法来确保jQuery事件在turbo-links打开时正常工作？您是否将脚本包装在特定于Rails的侦听器中？或者也许rails有某种魔力使它变得不必要？文档对于如何工作有点含糊，特别是通过application.js这样的清单加载多个文件。

Answer 1

我刚得知另一个解决这个问题的方法。如果您加载jQuery-turbolinksgem，它会将Rails Turbolinks事件绑定到document.ready事件，这样您就可以以通常的方式编写jQuery。您只需在js清单文件中的jQuery后面添加jQuery.turbolinks（默认情况下:application.js)。

Answer 2

我是这么做的...coffeescript：

ready = ->

  ...your coffeescript goes here...

$(document).ready(ready)
$(document).on('page:load', ready)

最后一行监听页面加载，这是turbo链接将触发的。

编辑...正在添加Javascript版本（每个请求）：

var ready;
ready = function() {

  ...your javascript goes here...

};

$(document).ready(ready);
$(document).on('page:load', ready);

Rails5(Turbolinks5)page:load变为Turbolinks:load，甚至会在初始加载时激发。所以我们可以只做以下操作：

$(document).on('turbolinks:load', function() {

  ...your javascript goes here...

});