关于checkbox的全选和反选功能

时间:2021-12-04 09:35:35
<script src="jquery.min.js"></script>
<script>
$(function(){
$("#checkAll").click(function(){
$("input[name='check']").each(function(){
$(this).attr("checked","");
});
});



$("#unCheckAll").click(function(){
$("input[name='check']").each(function(){
$(this).removeAttr("checked");
});
});
});
</script>
<a href="javascrip:void(0)" id="checkAll">全选</a>
<a href="javascrip:void(0)" id="unCheckAll">反选</a>


<input type="checkbox" name="check"/>
<input type="checkbox" name="check"/>
<input type="checkbox" name="check"/>
<input type="checkbox" name="check"/>
<input type="checkbox" name="check"/>
<input type="checkbox" name="check"/>
<input type="checkbox" name="check"/>
<input type="checkbox" name="check"/>

<input type="checkbox" name="check"/>

译----->本来就是很简单的一段代码来实现checkbox的全选和反选,如果使用jquery的attr方法,当你点击单个checkbox,然后来回切换全选和反选,那么你会发现有的全选无法全部选中,反选也无法全部不选中。针对以上代码只需要将红色的部分改成如下:

红色部分1---->this.checked = true;

红色部分2---->this.checked = false;

 修改后完美解决。