jquery checkbox全选失效怎么解决?

发布时间:2021-01-22编辑:脚本学堂
jquery checkbox全选功能失效怎么办,jquery实现checkbox复选框全选不可用是什么原因,有遇到这个问题的朋友参考下。

jquery 实现checkbox全选很方便,不过这次却发现全选功能无效了。

如果使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将获得一个属性(attribute) ,它不改变该复选框被选中和选中。

它只是用来存储默认或选中属性的初始值。为了保持向后兼容,.attr() 方法从 jQuery 1.6.1+ 开始除了返回属性值外,还会更新 property 属性,因此 boolean attribute(布尔属性)不需要通过 .prop() 来改变其值。

一,获取 checked 值。
使用jQuery的attr方法获取与设置复选框的”checked”属性,第一次全选/取消全选有效,之后就无效了。

从页面源文件来看,复选框属性确实已被更新了,只是页面中没有更新。

以下是正确的方法:
 

复制代码 代码示例:
<script type="text/javascript" src="/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>