使用jQuery更正"全选"复选框

zhu*_*hou 2 jquery

http://briancray.com/tests/checkboxes/index.html

实现全选的方法很简单,但并不完美.select all和unselect all工作正常,但当选择all all状态时,如果取消选中一个,则select all也会被选中.如何纠正?

在此输入图像描述

然后

在此输入图像描述

仍然检查"全部检查".如何纠正?

Mat*_*all 6

警告,无耻的自我提升.

我已经为jQuery编写了一个插件来完成这种事情.看看:http://mjball.github.com/jQuery-CheckAll

要将它与您链接的页面上的标记一起使用:

<form action="#" method="post" id="myform"> 

<fieldset> 
    <div class="radio"><input type="checkbox" name="checkall" id="checkall"> <label for="checkall">Check all</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox1" id="checkbox1"> <label for="checkbox1">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox2" id="checkbox2"> <label for="checkbox2">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox3" id="checkbox3"> <label for="checkbox3">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox4" id="checkbox4"> <label for="checkbox4">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox5" id="checkbox5"> <label for="checkbox5">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox6" id="checkbox6"> <label for="checkbox6">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox7" id="checkbox7"> <label for="checkbox7">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox8" id="checkbox8"> <label for="checkbox8">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox9" id="checkbox9"> <label for="checkbox9">Checkbox</label></div> 
    <div class="radio"><input type="checkbox" name="checkbox10" id="checkbox10"> <label for="checkbox10">Checkbox</label></div> 
</fieldset> 

</form> 
Run Code Online (Sandbox Code Playgroud)

这就足够了:

$('#checkall').checkAll('#myform input:checkbox:not(#checkall)');
Run Code Online (Sandbox Code Playgroud)

演示:http://jsfiddle.net/mattball/npeTz/

CheckAll与jQuery 1.4.4和1.5.2一起正常工作.我没有时间为jQuery 1.6更新它.抱歉.


针对jQuery 1.6兼容性进行了更新:http://jsfiddle.net/mattball/CVQsp/


即使你不小心选择了主人和奴隶,它仍然有效:http://jsfiddle.net/mattball/BwFvc/