页面
<input type="button" value="全选" id="check-all" />
<input type="checkbox" class="checkOne" value="鸭蛋1" />鸭蛋1<br />
<input type="checkbox" class="checkOne" value="鸭蛋2" />鸭蛋2<br />
<input type="checkbox" class="checkOne" value="鸭蛋3" />鸭蛋3<br />
<input type="checkbox" class="checkOne" value="鸭蛋4" />鸭蛋4<br />
<input type="checkbox" class="checkOne" value="鸭蛋5" />鸭蛋5<br />
<input type="checkbox" class="checkOne" value="鸭蛋6" />鸭蛋6
js
$("#check-all").click(function () {
var isCheckAll =$('input[id="check-all"]:checked').length;
if (isCheckAll==0) {
$('input[name="checkOne"]').each(function() {
this.checked = false;
});
} else if(isCheckAll==1) {
$('input[name="checkOne"]').each(function() {
this.checked = true;
});
}
});
当子checkbox一个一个全部勾选上时,全选的checkbox自动勾上:
$('input[type="checkbox"]').click(function() {
if($('input[name="checkOne"]:checked').length == $('input[name="checkOne"]').length){
$('input[id="check-all"]').prop("checked",true);
}else {
$('input[id="check-all"]').prop("checked",false);
}
});