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已经被加载，但是只有在我重新加载页面之后才能使用。

Answer 1

对于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(); }) 

Answer 2

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

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

Answer 3

我想这是一个涡轮问题。

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

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

如上所述。

Answer 4

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

Answer 5

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

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

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

 gem 'jquery-turbolinks' 

Answer 6

Rails 5使用jquery.turbolinks gem并使用

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