checkBox全選及取消全選
阿新 • • 發佈:2018-11-23
頁面
js<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
當子checkbox一個一個全部勾選上時,全選的checkbox自動勾上:$("#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; }); } });
$('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);
}
});