我在尝试“以Rails的方式”组织JS文件时遇到了Rails4应用程序中的一个问题。他们以前分散在不同的观点。我将它们组织到单独的文件中,并用资产管道编译它们。但是,我刚刚了解到,当turbo-linking被打开时,jQuery的“ready”事件不会在随后的点击时触发。当你第一次加载一个页面时,它就可以工作了。但是当您单击一个链接时,ready(function($){
中的任何内容都不会被执行(因为页面实际上不会再次加载)。
所以我的问题是:什么是正确的方法来确保jQuery事件在turbo-links打开时正常工作?您是否将脚本包装在特定于Rails的侦听器中?或者也许rails有某种魔力使它变得不必要?文档对于如何工作有点含糊,特别是通过application.js这样的清单加载多个文件。
我是这么做的...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-turbolinks
gem,它会将Rails Turbolinks事件绑定到document.ready
事件,这样您就可以以通常的方式编写jQuery。您只需在js清单文件中的jQuery
后面添加jQuery.turbolinks
(默认情况下:application.js
)。