如何获取 div 元素(jQuery)的所有子输入

HTML:

<div id="panel">
<table>
<tr>
<td><input id="Search_NazovProjektu" type="text" value="" /></td>
</tr>
<tr>
<td><input id="Search_Popis" type="text" value="" /></td>
</tr>
</table>
</div>

我需要选择特定 div 中的所有输入。

这样不行:

var i = $("#panel > :input");
463510 次浏览
小开
最佳答案

使用时不要使用大于:

$("#panel :input");

>意味着只有 直接的子元素，如果你想所有的子元素不管深度只使用一个空格。

小开

你需要

var i = $("#panel input");

或 ，具体取决于您想要什么(参见下面)

var i = $("#panel :input");

>将限制为子代，你希望所有的后代。

编辑: 正如尼克指出的，在 $("#panel input")和 $("#panel :input)之间有一个细微的差别。

第一个只检索类型输入的元素，即 <input type="...">，但不检索 <textarea>、 <button>和 <select>元素。谢谢尼克，我自己并不知道这一点，并相应地更正了我的帖子。留下了这两个选项，因为我猜 OP 也没有意识到这一点，并且-从技术上来说-请求输入... : -)

小开 
var i = $("#panel input");

应该可以: -)

只能找到直接的孩子，没有孩子的孩子
是用于使用伪类，例如: hover 等。

你可以在这里了解到伪类的可用 css 选择器: http://docs.jquery.com/DOM/Traversing/Selectors#CSS_Selectors

小开

“ find”方法可以用来获取已经缓存的容器的所有子输入，以便再次查找(而“ children”方法只获取直接的子输入)。例如:。

var panel= $("#panel");
var inputs = panel.find("input");
小开

如果你使用 Ruby on Rails 或 Spring MVC 这样的框架，你可能需要使用带有方括号或其他字符的 div，这是不允许的，你可以使用 document.getElementById，如果你有多个输入同一类型，这个解决方案仍然有效。

var div = document.getElementById(divID);
$(div).find('input:text, input:password, input:file, select, textarea')
.each(function() {
$(this).val('');
});
$(div).find('input:radio, input:checkbox').each(function() {
$(this).removeAttr('checked');
$(this).removeAttr('selected');
});

这个例子展示了如何清除输入，对于您来说，您需要修改它。

小开

我的方法是:

你可以在其他场合使用它。

var id;
$("#panel :input").each(function(e){
id = this.id;
// show id
console.log("#"+id);
// show input value
console.log(this.value);
// disable input if you want
//$("#"+id).prop('disabled', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="panel">
<table>
<tr>
<td><input id="Search_NazovProjektu" type="text" value="Naz Val" /></td>
</tr>
<tr>
<td><input id="Search_Popis" type="text" value="Po Val" /></td>
</tr>
</table>
</div>


提交答案