Rails Javascript onchange 与 <script> 一起工作但不在外部

Question

在我的 index.html.erb 文件中，我有一个成功提交 onChange 的表单。但是，这仅在我使用放置在表单后的 <script> 标签时才有效。为什么同样的js在welcome.js中却不是运行？索引加载为 /welcome 路由。

# app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ace.min
//= require jquery.sortable
//= require chartkick
//= require hammer
//= require_tree .

外部js文件

# app/assets/javascripts/welcome.js

$('.chart-radio-icon').change(function(){
  $('#mega_form').submit();
});

查看

# views/welcome/index.html.erb
<%= form_tag mega_chart_path, id: 'mega_form', remote: true do %>
    <%= radio_button_tag :metric_type, :followers_count, true, :class => 'chart-radio-icon'%>
    <%= label_tag(:followers, 'Followers', :class => 'chart-label chart-label-social') %>

同样，将 js 放置在视图中的 <script> 标记中时有效，但在外部无效。

Answer 1

编辑：

因为我们确定您的资产文件未包含在开发中。要进行健全性检查，请尝试此操作并重新启动您的服务器：

Rails.application.config.assets.precompile = %w( application.js application.css )

编辑结束

由于您使用的是 require_tree .，并且 welcome.js 文件位于 app/assets/javascripts 中，因此它将包含在您应用程序的所有页面中。 See here. 我认为问题在于页面加载时，事件侦听器未分配给 DOM 元素。尝试将您的 JS 代码包装在：

#app/assets/javascripts/welcome.js

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

Rails Javascript onchange 与 <script> 一起工作但不在外部

Rails Javascript onchange works with <script> but not externally

javascript

jquery

ruby-on-rails

view

jquery-events