提问者:小点点

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


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

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


共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...

});

匿名用户

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