为什么我的 object.children 未定义？

Question

我在 Ruby on Rails 上运行 javascript，以便在用户单击链接时将表单动态插入页面。

它不起作用，但一个特殊的错误让我的山羊：我的表单在调试控制台中返回 form.children UNDEFINED。

这是表单（在 Rails 中）：

<div class="field">
<%= f.label :name, 'Tag:' %>
<%= f.text_field :name %>   
</div>

这是 application.js 中的 javascript；

function add_fields(link, association, form) {
console.log(form);
console.log(form.children);
link.insertBefore(form, link.previousSibling.previousSibling);
}

我已经测试了该应用程序是否通过输出文本等实际调用了javascript并且它可以工作。问题显然出在我的表单上。

最后是控制台输出：

<div class="field">
<label for="post_tags_attributes_4_name">Tag:</label>
<input id="post_tags_attributes_4_name" name="post[tags_attributes][4][name]" size="30" type="text" />  
</div> application.js:21
undefined application.js:22
Uncaught Error: NOT_FOUND_ERR: DOM Exception 8 

顺便说一句，我正在尝试在动态插入的嵌套表单上实现 railscast #197，这是一场灾难！

---编辑---

这是我如何调用构建字段元素的 add_fields 函数：

红宝石函数：

module TagsHelper
    def link_to_add_fields(name, post_form, association)
        new_object = post_form.object.class.reflect_on_association(association).klass.new
        tag_field = post_form.fields_for :tags, new_object do|tag_form|
            render("tag_field", :f=>tag_form)
        end
        #debugger
        link_to_function(name, "add_fields(this, \"#{association}\", \"#{escape_javascript(tag_field)}\")")
    end
end

这里是 tag_field html：

<div class="field">
    <%= f.label :name, 'Tag:' %>
    <%= f.text_field :name %>   
</div>

Answer 1

显然这行不通，因为一个元素不能有一个同时是兄弟的子元素。

link.insertBefore(form, link.previousSibling.previousSibling);

您的代码希望将form 作为link 的孩子并且在link 的兄弟姐妹之一之前，这是不可能的。

记住，.insertBefore 必须从插入它的 父 调用。所以要在link 之前插入form，必须从link 的父级调用.insertBefore。

---

所以也许你打算改用link.parentNode。

link.parentNode.insertBefore(form, link.previousSibling.previousSibling);

这将在link 的第二个兄弟之前插入form。