有没有办法从类型集合中选择第一个元素

Question

我想知道是否有一种方法使用jQuery(以链接方式)来选择以下内容:

<div class="panel">
    <input id="first" type="text" />
    <input id="second" type="text" />
</div>

<div class="panel">
    <h2>Panel title</h2>
    <textarea id="third"></textarea>
    <input id="fourth" type="text" />
</div>

<div class="panel">
    <p>Some paragraph</p>
    <select id="fifth"></select>
    <input id="sixth" type="text" />
</div>

我想选择每个中存在的第一个表单元素(即input/ select/ textarea)div.panel.

所以在上面的例子中,我的jQuery选择将返回一个集合三个要素:input#first,textarea#third和select#fifth.

以下循环将获得我所追求的结果,但肯定有一种更清晰的方式与jQuery一致,可以一次性完成这项工作吗？

var firstFormFieldList = [];

$('.panel').each(function(i, el){
   var firstEl = $(el).find('input,select,textarea').filter(':first');
   firstFormFieldList.push(firstEl);
});

Answer 1

您正在寻找:input选择器(DOCS):

$('.panel').find(':input:first')

例