Rails的JavaScript只有在重新加载后才有效

问题正是标题所说的。 该javaScript是在资产pipe道,即assets / javascripts / myfile.js.coffee在application.js我有:

//= require jquery //= require jquery_ujs //= require turbolinks //= require jquery.ui.all //= requier twitter/bootstrap //= require jasny-bootstrap //= require_tree . 

这是咖啡的脚本

 $(document).ready -> $("#close").click -> $(this).parent().parent().slideUp("slow") $( "#datepicker" ).datepicker dateFormat : "yy-mm-dd" player_count = $("#player option").length $('#btn-add').click -> $('#users option:selected').each -> if player_count >= 8 $('#select-reserve').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>") $(this).remove() else $('#player').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>") $(this).remove() player_count++ $('#btn-remove').click -> $('#player option:selected').each -> $('#users').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>") $(this).remove() player_count-- $('#btn-remove-reserve').click -> $('#select-reserve option:selected').each -> $('#users').append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>") $(this).remove() $("#submit").click -> $("select option").prop("selected", "selected") 

我可以在浏览器的源代码中看到javaScript已经被加载,但是只有在我重新加载页面之后才能使用。

对于turbolinks 5.0,您必须使用turbolinks:load事件,这是在页面加载时首次调用,并且每次都在turbolink访问时调用。 更多信息: https : //github.com/turbolinks/turbolinks#running-javascript-when-a-page-loads

CoffeeScript代码:

 $(document).on 'turbolinks:load', -> my_func() 

JavaScript代码:

 document.addEventListener("turbolinks:load", function() { my_func(); }) 

这是一个激动人心的问题。 感谢@ zwippie让我朝着正确的方向前进! 解决办法是把我的咖啡包装在这里:

 ready = -> // functions $(document).ready(ready) $(document).on('page:load', ready) 

我想这是一个涡轮问题。

要么从您的项目中删除turbolinks或修改您的脚本,如:

 $(function() { initPage(); }); $(window).bind('page:change', function() { initPage(); }); function initPage() { // Page ready code... } 

如上所述。

你可以安装jquery.turbolinks gem来解决这个问题,而不用改变你的Javascript。

你可以把你的jquery.turbolink放在正确的位置

  //= require jquery //= require jquery.turbolinks //= require jquery_ujs //= require bootstrap-sprockets //= require turbolinks 

在Gemfile中,你可以安装jquery-turbolinks gem

 gem 'jquery-turbolinks' 

Rails 5使用jquery.turbolinks gem并使用

 $( document ).on('turbolinks:load', function() { // your code }