这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下
如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将获得一个属性(attribute) ,它不改变该复选框被选中和选中。它只是用来存储默认或选中属性的初始值。为了保持向后兼容,.attr() 方法从 jQuery 1.6.1+ 开始除了返回属性值外,还会更新 property 属性,因此 boolean attribute(布尔属性)不需要通过 .prop() 来改变其值。推荐使用上述方法之一,来取得 checked 的值。
使用jQuery的attr方法获取和设置复选框的”checked”属性,发现第一次全选/取消全选有效,之后就无效了,但查看html源文件,复选框属性确实已经被更新了,就是页面中没有更新,正确的方法如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<script type= "text/javascript" src= "http://code.jquery.com/jquery-1.11.1.min.js" ></script><script type= "text/javascript" >// <![CDATA[
$( function (){
$( '.ckAll' ).click( function (){
$( ".box-items" ).each( function (){
$( this ).prop( "checked" ,!!$( ".box-all" ).prop( "checked" ));
}); }); }); // ]]></script> <div><label class= "ckAll" ><input class= "box-all" type= "checkbox" /><span>全选</span></label>
<input class= "box-items" type= "checkbox" />
<input class= "box-items" type= "checkbox" />
<input class= "box-items" type= "checkbox" />
<input class= "box-items" type= "checkbox" />
<input class= "box-items" type= "checkbox" />
</div> |