.insertBefore()不是函数javascript
.insertBefore()不是函数javascript
提问于 2015-10-01 07:40:04
所以我有一个页面，在点击按钮时，它会打开一个嵌套的字段，我想在单击时隐藏字段中的一个div，但到目前为止，我的函数不起作用。
我的js文件
$('body').on('click', '#main-applicant-btn', function() {
event.stopPropagation();
var prependData = $('.main-applicant').children().first().clone();
prependData.find("div.checkbox").replaceWith( $( "div.checkbox.hide" ));
var prependedData = $('.main-applicant').children().last();
var list = document.getElementsByClassName("main-applicant");
list.insertBefore(prependData, prependedData);
})我的applicant.html.erb文件
<div class="form-group">
<%= f.link_to_add "", :applicant_commitments, :class => "glyphicon glyphicon-plus-sign pointer add", :id => "main-applicant-btn", :data => {:target => "#main-applicant-#{rand}"} %>
</label>
</div>
<span id="main-applicant-<%= rand %>" class="main-applicant">
<%= f.simple_fields_for :applicant_commitments do |applicant_commitment| %>
<%= render "existing_commitment_fields", {:f => applicant_commitment, :instalment => true, :type => 'existing_commitment_applicant'} %>
<% end %>
</span>我的嵌套字段existing_commitment_fields.html.erb
<div class="form-group monthly-instalment-lender-checkbox">
<div class="col-sm-3" id="checkbox-existing-fields">
<div class="checkbox">
<label>
<span>Joint Name</span>
<%= f.input_field :joint_name, as: :boolean, class: "joint-name-commitment" %>
</label>
</div>
</div>
</div>所以在单击时，我想要main-applicant-btn，当它显示nested_fields时，我将隐藏div.checkbox，但到目前为止，当我尝试此代码时，我得到错误.insertBefore()不是一个函数。
谁有任何关于如何附加或强制javascript在加载后运行代码的线索？
回答 1
Stack Overflow用户
发布于 2015-10-01 11:29:28
insertBefore是一种节点方法。
document.getElementsByClassName()方法返回一个HTMLCollection。
你必须遍历这个HTMLCollection或者选择其中的一个元素来实际接触节点并使用它们的方法：
list[0].insertBefore(...,...)
此外，正如@nnnnnn所提到的，“insertBefore()方法不希望jQuery对象作为参数。”
因此，要么使用普通的document.querySelector('')方法，要么调用jQuery对象的目标($(...)[0])。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32877264
复制相关文章
相似问题
腾讯云开发者
