获取具有特定标签的子元素 jQuery

Question

我试图通过仅提供表单的名称并且只知道那些想要的字段是输入元素来从 jQuery 获取特定表单的所有输入元素。

比方说：

<form action='#' id='formId'>
<input id='name' />
<input id='surname'/>
</form>

如何使用 jQuery 单独访问它们？ 我尝试了类似 $('#formId > input') 的方法，但没有成功，实际上控制台上返回了一个错误 “XML 过滤器应用于非 XML 值（函数（ a, b) {return new (c.fn.init)(a, b);})"

也许我必须用 .children 或类似的东西来做？我对 jQuery 还很陌生，而且我不太喜欢这些文档。 Mootools 更友好，或者也许我只是需要习惯它。

哦，最后但并非最不重要的一点是，我之前见过它问过，但没有最终答案，我可以使用 jQuery 创建一个新的 dom 元素并在将它插入（如果我这样做的话）到代码中之前使用它吗？在mootools中，我们有类似 var myEl = new Element(element[,properties]); 然后你可以在进一步的表达式中引用它，但我无法理解如何在 jQuery 上做到这

一点我最终做的是这样的： $('#where').before("Link Text") 但这违背了在插入它之前使用它的要求，如果你知道我的意思的话。

提前致谢。

Answer 1

如果您想要所有后代，那么 @woland 的答案有效。如果您确实只想要您的 > 所示的直系子代，然后

$('#form').children('input')

Wolands 匹配名字、姓氏和电话。我的只匹配名字和姓氏

<form action='#' id='formId'>
<input id='name' />
<input id='surname'/>
<div>
<input id='phone'/>
</div>
</form>

Answer 2

我希望这能回答您的问题。

<script type="text/javascript">

$(document).ready(function() {
        // Question part 1
    var formInputs = $("form#formId :input");
    formInputs.each(function(index) {
         alert(index + ': ' + $(this).attr("id") + "=" + $(this).val());
    });

        // Question part 2
    var a = $("<a id='linkId' href='#'>Link Text</a>");
    a.click(function(){alert("hello")});
    $('#where').before(a);


});
</script>

<form action="#" id="formId">
  <input id="name" type="text" value="foo" />
  <input id="surname" type="text" value="bar" />
  <div>
  <input id="phone" type="text" value="911"/>
  </div>
</form>
</div>
<div id="where"></div>

Answer 3

它的工作原理如下：

$('#formId input')

Answer 4

如果您想循环遍历所有输入，请查看 each() jQuery 中的函数：