如何在 Rails 5 中正确编写 jQuery 代码（使用 turbolinks 5）

Question

我正在我的 Rails 5 应用程序中编写 jQuery 代码，看起来代码没有编译。这是我的代码：

application.html.erb

 <%= content_for?(:head) ? yield(:head) : '' %>
    <%= javascript_include_tag "application" %>
    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_include_tag "//www.google.com/jsapi", "chartkick" %>

application.js

//= require code.js
//= require jquery
//= require fancybox
//= require jquery_ujs
//= require jquery.turbolinks
//= require turbolinks
//= require bootstrap-sprockets
//= require bootstrap
//= require_tree .
$.turbo.use('turbolinks:load', 'turbolinks:request-start')

function printpage()
{
   window.print()
}

var resetForms = function () {
  // this depends on your use
  // this is for foundation 6's abide
  $('form').each(function () {
    $(this).foundation('destroy');
  });
};

document.addEventListener("turbolinks:before-cache", function() {
  resetForms();
});

当我尝试在 code.js 中使用 $(document).ready(function(){}); 时它根本不起作用，但是当我尝试这样的操作时：

document.addEventListener("turbolinks:load", function() {
 alert("ok!")
});

它没有问题。我不明白为什么代码可以与 Rails 的其他版本一起使用，但这次不起作用。此外，我可以说我的应用程序在版本号 5

中使用 turbolinks

Answer 1

$(document).ready(function() {
  resetForms();
});

这不会起作用，因为 Turbolinks 会覆盖正常的页面加载过程，不会触发它所依赖的事件。如果您的代码看起来像这样，您必须更改代码来执行此操作：

$(document).on('turbolinks:load', function() {
    resetForms();
});

如果它与另一个版本的 rails 一起工作，它可能使用的是旧版本的 turbolinks。

http://guides.rubyonrails.org/working_with_javascript_in_rails.html#turbolinks[1]

如何在 Rails 5 中正确编写 jQuery 代码（使用 turbolinks 5）

How to write jQuery code properly in Rails 5 (with turbolinks 5)

jquery

ruby-on-rails

turbolinks