[英]jQuery selector all elements except whose parent is div
以下是我的HTML:
<div id="formdata">
<div id="to_select">
<input type='hidden' name='to_be_selected' value='a' />
<input type='hidden' name='also_to_be_selected' value='a' />
</div>
<input type='hidden' name='to_be_selected_too' value='a' />
<div id="not_to_select">
<input type='hidden' name='not_to_select' value='not selected'/>
</div>
</div>
如何仅选择不在div#not_to_select中的元素
以下是我的尝试:
$("#formdata div:not(#not_to_select)").find('input')
$("#formdata").not("div#not_to_select").find('input,select,textarea')
$("#formdata").find('input,select,textarea').filter(function(){
return $(this).parent().is(":not(#not_to_select)");
})
要做到这一点,你可以使用filter()
排除inputs
它们的后代#not_to_select
:
var $inputs = $('#formdata input').filter(function() { return $(this).closest('#not_to_select').length == 0; }); $inputs.addClass('foo');
.foo { border: 1px solid #C00; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="formdata"> <div id="to_select"> <input type="text" name="to_be_selected" value="a" /> <input type="text" name="also_to_be_selected" value="a" /> </div> <input type="text" name="to_be_selected_too" value="a" /> <div id="not_to_select"> <input type="text" name="not_to_select" value="not selected" /> </div> </div>
或者,您可以使用:not()
来排除它们:
var $inputs = $('#formdata input:not(#not_to_select input)'); $inputs.addClass('foo');
.foo { border: 1px solid #C00; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="formdata"> <div id="to_select"> <input type="text" name="to_be_selected" value="a" /> <input type="text" name="also_to_be_selected" value="a" /> </div> <input type="text" name="to_be_selected_too" value="a" /> <div id="not_to_select"> <input type="text" name="not_to_select" value="not selected" /> </div> </div>
我建议如下:
$(function() { var $inputs = $("#formdata input:not([name='not_to_select']"); $inputs.each(function(i, el) { console.log(i, $(el).attr("name")); }); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="formdata"> <div id="to_select"> <input type='hidden' name='to_be_selected' value='a' /> <input type='hidden' name='also_to_be_selected' value='a' /> <input type='hidden' name='not_to_select' value='not selected' /> </div> <input type='hidden' name='to_be_selected_too' value='a' /> <div id="not_to_select"> <input type='hidden' name='not_to_select' value='not selected' /> </div> </div>
由于您正在查找具有name
属性的项目,因此您可以使用:not
in选择要排除的项目。
在我看来,我会建议使用class
属性。 可以使选择元素组变得更容易。
希望有所帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.