Question

2014-04-16

198

javascript jquery ruby-on-rails nested-forms jquery-events

我正在使用带有 Rails 4 的 nested_forms 以及 turbo-links + jQuery 插件使其在页面加载时重新启动。一旦我添加一个带有标记的嵌套字段，该字段应该会触发事件，它就会失败，似乎只有初始页面加载时的内容才能触发 js 事件。

示例：

$(document).ready(function(){
  $('.address_input_type').on('change', function(){
    showAppropriateAddressFields(this);
  })
});

因此，如果“.address_input_type”最初在页面上，则 function showAppropriateAddressFields 将触发，但如果之后添加，则会失败。有什么想法吗？

Answer 1

由于元素是新插入的，您需要使用事件委托：

$(document).ready(function(){
  $(document).on('change', '.address_input_type', function(){
    showAppropriateAddressFields(this);
  })
});

尝试找到比 document 更近的父元素（例如容器 div）作为选择器，因为使用 document 效率不高。

Answer 2

如果您在页面加载时查询 DOM 中的某个类，您将返回一个类似数组的节点对象，当稍后添加具有该类的其他节点时，该节点不会自行更新。从头开始将其附加到页面并设置其样式“display: none”。