Turbolinks缓存之前和之后的Javascript DOM事件

我在这里：

$(document).on 'turbolinks:load', -> console.log "page has loaded!" $ -> $("button#show-hide").click (e) -> e.preventDefault() 

这使得我的click事件仅在Turbolinks缓存页面后可用。 我可以做$(document).on 'turbolinks:before-visit ，只有在Turbolinks缓存之前才能使事件可用。 我应该如何随时提供活动？

Answer 1

我认为这里的问题是你绑定了两个事件： turbolinks:load和$(document).ready() 。

Turbolinks不会丢弃document上的事件侦听器，因此您可以安全地将单击处理程序绑定到它，它们将被称为跨页加载。 来自Turbolinks文档：

如果可能，请避免使用turbolinks：load事件将事件侦听器直接添加到页面主体上的元素。 相反，请考虑使用事件委派在文档或窗口上注册一次事件侦听器。

考虑到这一点，您可以：

 $(document).on 'click', "button#show-hide", (e) -> e.preventDefault() 

Answer 2

你怎么样只是将click事件从’turbolinks：load’中取出来

‘turbolinks：before-visit’背景。

或者如果在DOM中动态添加按钮，您可以执行的操作是将单击处理程序附加到正文，然后单击确定单击了哪个元素并相应地继续。

 $('body').on('click','button#show-hide',function(){ }); 

在咖啡脚本中，你可以做到

 $('body').on('click', 'button#show-hide', ( -> )); 

UPDATE

从Rails的答案来看，点击通过link_to帮助后javascript没有加载

如果您希望您的点击处理程序在page:change上工作page:change以及您可以执行的ready事件，

 var ready = function() { // bind click handlers to DOM elements here }; $(document).ready(ready); $(document).on('page:change', ready);