Jquery 如何获得特定父母的子女?
有几个类似的HTML段。我想在单击“全部检查”时检查属于该类的“检查项目”。但当我点击“全部检查”时,所有“检查项目”都被选中。如何修复它?谢谢 HTML:Jquery 如何获得特定父母的子女?,jquery,Jquery,有几个类似的HTML段。我想在单击“全部检查”时检查属于该类的“检查项目”。但当我点击“全部检查”时,所有“检查项目”都被选中。如何修复它?谢谢 HTML: <div class="shopcart-con" data-merchant-id="1"> <div class="shopcart-list"> <div class="shopcart-lstop"><input type="checkbox" cla
<div class="shopcart-con" data-merchant-id="1">
<div class="shopcart-list">
<div class="shopcart-lstop"><input type="checkbox" class="check_all" name="select"/>fruit shop A</div>
<div class="shopcart-lscon">
<ul class="shop_contentul" data-product-id="1">
<li class="checkinp"><input type="checkbox" class="check_item" name="aihao" /></li>
<li class="checkimg"><img src="images/home10.png" width="100%" height="75px"></li>
<li class="checknum" >
<p class="lineheight30">apple</p>
<span class="shopcart-num">
<input type="button" name="" class="inp-reduce">
<input type="text" name="" class="num" value="5">
<input type="button" name="" class="inp-add">
</span>
</li>
¥<span class="unit_price">8.00</span>
<p><font color="#808080" size="2px"><s> $12.00</s></font></p>
<p>x<label class="shuli">5</label></p>
<input class="delbtn" name="">
</ul>
<div class="clear"></div>
</div>
<div class="shopcart-lscon">
<ul class="shop_contentul" data-product-id="2">
<li class="checkinp"><input type="checkbox" class="check_item" name="aihao" /></li>
<li class="checkimg"><img src="images/home10.png" width="100%" height="75px"></li>
<li class="checknum" >
<span class="shopcart-num">
<input type="button" name="" class="inp-reduce">
<input type="text" name="" class="num" value="5">
<input type="button" name="" class="inp-add">
</span>
</li>
¥<span class="unit_price">8.00</span>
<!-- <p><font color="#808080" size="2px"><s> $12.00</s></font></p> -->
<p>x<label class="shuli">5</label></p>
<input class="delbtn" name="">
</ul>
<div class="clear"></div>
</div>
<div>
<p class="shopcart-money">共计<label class="product_quantity" data-merchant-id="1">10</label> sum:$<label class="price_sum" data-merchant-id="1" style="color:red">80</label></p>
</div>
</div>
</div>
尝试以下操作:您正在使用
$('.check_all')。最近的将在allcheck_all
下找到购物车con
。但是你需要为点击的查找购物车con
,因此使用$(此)
类似于$(此)。最近的
$('.check_all').click(function(){
var checked_items = $(this).closest('.shopcart-con').find('.check_item')
console.log(checked_items.length)
if($(this).prop('checked')){
$.each(checked_items, function(i,val){
val.checked = true;
});
}else{
$.each(checked_items, function(i,val){
val.checked = false;
});
}
});
您可以使您的代码更短,您不需要迭代所有复选框并设置其属性,请参见下面的代码
$('.check_all').click(function(){
var checked_items = $(this).closest('.shopcart-con').find('.check_item')
console.log(checked_items.length)
$(checked_items).prop('checked',this.checked);
});
$('.check_all').click(function(){
var checked_items = $(this).closest('.shopcart-con').find('.check_item')
console.log(checked_items.length)
$(checked_items).prop('checked',this.checked);
});