为什么 jQuery 在我的 rails 5 应用程序中不起作用？

Question

我正在尝试在我的新 Rails5 应用程序中编写我的第一个 js 代码，但似乎无法让 Jquery 工作，猜测这是配置/环境问题，但尽管我进行了所有搜索和确认更改，但我似乎无法让它运行。谁能看出我做错了什么？：

宝石文件；

 # Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'

application.html.erb;

<title>MyEngine</title>
<!-- Gon::Base.render_data -->
<%= Gon::Base.render_data %>
<%= csrf_meta_tags %>
<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

new.html.erb;

<%= link_to 'Remove Employee', '#', id: 'hide-employee' %>

quotes.coffee;

$(document).on "page:change", ->
    $('#hide-employee').click ->
        alert "Clicked!"

点击时没有警报。没有错误，服务器运行和页面渲染正常，只是控制台什么都没有。

感谢您的帮助。

Answer 1

尝试使用 turbolinks:load 代替。

$(document).on 'turbolinks:load', ->
  $('#hide-employee').click ->
    alert 'Clicked!'

Answer 2

对于那些因为拥有 Rails 5.1 而来到这里的人，jQuery 不再是默认依赖项。来自release notes：

在早期版本的 Rails 中默认需要 jQuery 来提供数据远程、数据确认和 Rails 的 Unobtrusive JavaScript 产品的其他部分等功能。不再需要它，因为 UJS 已被重写为使用普通的原生 JavaScript。此代码现在作为 rails-ujs 包含在 Action View 中。

如果需要，您仍然可以使用 jQuery，但默认情况下不再需要它。

要将其重新添加，请添加到Gemfile：

gem 'jquery-rails'             # Use jquery as the JavaScript library

然后

$ bundle

Answer 3

page:change 事件在turbolinks-classic 中定义。此版本现已弃用，您可以自己查看。

相反，您可以使用turbolinks:load or turbolinks:render or turbolinks:before-render。

Answer 4

确保您是 app/assets/javascripts/application.js 包含：

//= require jquery
//= require jquery-ujs

注意：如果您使用的是 Rails 5.1，则可以省略 //= require jquery_ujs 以支持 //= require rails-ujs。

另外，请考虑彻底删除 turbolink。这样做解决的资产管道问题比我想象的要多。我有一种感觉，无论如何它并没有为您提供太多价值。 :-)

删除涡轮链接：

1. 从 Gemfile 和 $ bundle 中删除 turbolinks。
2. 从 app/assets/javascripts/application.js 中删除 //= require turbolinks
3. 从 app/views/layouts/application.html.erb 中删除两个 "data-turbolinks-track" => true 哈希。