Jquery Rails 5 ReferenceError:未定义函数

我正在尝试（整个上午：-S）在onChange上加载一个js函数，以在表单中填充一些字段。 我已经为此寻找了解决方案，这让我添加了jquery TurboLink，甚至尝试删除TurboLink。这不管用

为什么该功能未被识别

ReferenceError:未定义更新\子\进程\字段

application.js

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require turbolinks
//= require bootstrap-sprockets
//= require bootstrap-datepicker/core
//= require bootstrap-datepicker/locales/bootstrap-datepicker.pt.js
//= require_tree .

sub_咖啡

ready = ->

update_sub_process_fields = (sub_process_type_id) ->
  jQuery.ajax
    url: '/sub_processes/update_fields'
    type: 'GET'
    data: 'sub_process_type_id': sub_process_type_id
    dataType: 'html'
    success: (data) ->
      jQuery('#sub_process_fields').html data
      return
  return

$(document).ready(ready)
$(document).on('page:load', ready)

_form.erb.html

 <div class="field">
   <%= f.label :sub_process_type %>
   <%= f.select(:sub_process_type_id, options_for_select(SubProcessType.all.map {|s| [s.name, s.id]},sub_process.sub_process_type_id),{prompt: "Select Sub Process...", include_blank:true}, onChange: "update_sub_process_fields(this.value)") %>
  </div>


  <div class="field">
    <%= f.label :codenr %>
    <%= f.text_field :codenr %>
  </div>

<div id = "sub_process_fields">
  <div class="field">
    <%= f.label :name %>
    <%= f.text_field :name %>
  </div>

  <div class="field">
    <%= f.label :description %>
    <%= f.text_field :description %>
  </div>
</div>

解决方案 根据我的评论，您需要通过全局

窗口

对象公开您的函数

因此，请替换：

update_sub_process_fields = (sub_process_type_id) ->

与：

解释 Coffeescript不会使局部变量全局可访问。在JS中，您可以编写：

var a = 1;
b = 2;

这里

a

是当前上下文的局部变量，而

b

是全局变量

由于Coffeescript中没有

var

关键字，因此它使每个变量都是局部变量（以避免污染全局名称空间并导致错误）。要公开它，您需要使用commonjs之类的系统跨文件导入/导出或，您可以将其附加到全局对象。在浏览器中这是

窗口

，而在服务器端nodejs应用程序中则是

全局

您可以通过在咖啡脚本中添加

onChange

事件来绕过它

例如：

其中，

.sub\u process\u type

是选择框中的一个类，您要在其中侦听更改

---

编辑 要通过事件侦听器获取值，必须使用

事件

对象

---

---

1。咖啡脚本样本中的缩进是否正确？我认为

update\u sub\u process\u字段应该缩进到ready函数中？2.尝试使用
window.update\u sub\u process\u fields=…
而不是
update\u sub\u process\u fields=…
。如果它有效，我会添加一个答案来解释为什么非常感谢你，添加
窗口。
修复了它。缩进没有做任何事情（除了增加可读性）。请解释，“缩进没有做任何事情（除了增加可读性）”是不对的，缩进定义了CoffeeScript的结构。您的问题是一个空的
ready
函数。@muistooshort，在这个特定的场景中，添加窗口并保留缩进，就像最初一样。@MrWater，实际上@muistooshort是正确的。为ready编译的JS如下所示：
ready=function（）{}
，意思是
窗口。在就绪事件之前定义了更新子进程字段
——这很好，因为在通过事件触发之前，它不需要jQUery或DOM。但是我假设它应该在
ready
函数中，否则
ready
和
$（document）.
语句什么也不做。使用
document.on'change'，'sub_process_type'，update_sub_process_字段
无法获取当前选择的值，或者它会不会？@MrWater查看上面的编辑。您需要从事件对象中获取所选的值，该对象包含对select元素的引用
var a = 1;
b = 2;

document.on 'change', '.sub_process_type', update_sub_process_fields

update_sub_process_fields = (event) ->
  sub_process_type_id = event.target.value
  jQuery.ajax
    url: '/sub_processes/update_fields'
    type: 'GET'
    data: 
      sub_process_type_id: sub_process_type_id
    dataType: 'html'
    success: (data) ->
      jQuery('#sub_process_fields').html data
      return
  return