当前位置: 首页 > 编程笔记 >

jquery中checkbox全选失效的解决方法

白昊乾
2023-03-14
本文向大家介绍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”属性,发现第一次全选/取消全选有效,之后就无效了,但查看html源文件,复选框属性确实已经被更新了,就是页面中没有更新,正确的方法如下:

<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>
 类似资料:
  • 本文向大家介绍解决JQuery全选/反选第二次失效的问题,包括了解决JQuery全选/反选第二次失效的问题的使用技巧和注意事项,需要的朋友参考一下 最近在项目中,遇到一个问题,测试全选/反选功能时,第一次对母框进行选中/非选中时,能同步子框的全选/反选状态,之后再点击母框,子框就没反应了。 原代码大致结构关键如下: 步骤一:尝试正面刚一波: 卒-----完全没有效果,弃之。 步骤二:快速上网搜索一

  • 本文向大家介绍jQuery 更改checkbox的状态,无效的解决方法,包括了jQuery 更改checkbox的状态,无效的解决方法的使用技巧和注意事项,需要的朋友参考一下 今天写页面遇到复选框动态全选或全不选问题,正常写法如下: but!第一次点击全选按钮input显示对勾,第二次就不行了,查了下有建议用prop的,亲测有效。那两者有啥区别呢? jQuery函数attr()和prop()的区别

  • 本文向大家介绍JQuery 设置checkbox值二次无效的解决方法,包括了JQuery 设置checkbox值二次无效的解决方法的使用技巧和注意事项,需要的朋友参考一下 在此MVC ASP.NET 项目,我利用jquery ajax传输数据给后台controller控制层,返回数据给JQuery数据。 首先必须清除checkbox的选中,因为是ajax的异步操作,是不刷新页面的,所以需要手段充值

  • 本文向大家介绍js与jQuery实现checkbox复选框全选/全不选的方法,包括了js与jQuery实现checkbox复选框全选/全不选的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js与jQuery实现checkbox复选框全选/全不选的方法。分享给大家供大家参考,具体如下: 先来看看JavaScript实现checkbox复选框全选/全不选的方法。这应该是一个比较实用的前端

  • 本文向大家介绍jquery checkbox 勾选的bug问题解决方案与分析,包括了jquery checkbox 勾选的bug问题解决方案与分析的使用技巧和注意事项,需要的朋友参考一下 在做项目的时候遇到个jQuery checkbok复选框的选中取消的BUG,咨询了大神,才闹明白怎么回事,这里记录下来,分析给大家。 先上代码: 第一次执行,没问题,但第二次执行就有问题了,选择不了 解决办法:把

  • 本文向大家介绍jQuery实现checkbox全选、反选及删除等操作的方法详解,包括了jQuery实现checkbox全选、反选及删除等操作的方法详解的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery实现checkbox全选、反选及删除等操作的方法。分享给大家供大家参考,具体如下: 运行效果: 1.list.html 说明:用checkbox数组Check[]存放每一行的ID值