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 设置checkbox值二次无效的解决方法
在此MVC ASP.NET 项目,我利用jquery ajax传输数据给后台controller控制层,返回数据给JQuery数据. 首先必须清除checkbox的选中,因为是ajax的异步操作,是不刷新页面的,所以需要手段充值控件值,使得其为空,不影响下次的拿到数据显示. 言归正传,$("#checkboxID").attr('checked', false);//设置checkbox为不选中状态, $("#checkboxID").attr('checked',
-
使用prop解决一个checkbox选中后再次选中失效的问题
//问题点 初始状态复选框没有全选, 点击全选按钮调用checkAll方法, 实现了全选, 然后点击全不选按钮, 实现了全不选, 然后再次点击全选按钮, 结果却木有全选, 再反复点击木有任何反应. demo: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script
-
jQuery checkbox选中问题之prop与attr注意点分析
本文实例分析了jQuery checkbox选中问题之prop与attr注意点.分享给大家供大家参考,具体如下: 一个网上很多的例子如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.or
-
jquery中checkbox全选失效的解决方法
如果你使用jQuery 1.6 ,代码if ( $(elem).attr("checked") ),将获得一个属性(attribute) ,它不改变该复选框被选中和选中.它只是用来存储默认或选中属性的初始值.为了保持向后兼容,.attr() 方法从 jQuery 1.6.1+ 开始除了返回属性值外,还会更新 property 属性,因此 boolean attribute(布尔属性)不需要通过 .prop() 来改变其值.推荐使用上述方法之一,来取得 checked 的值. 使用jQu
-
利用jQuery实现CheckBox全选/全不选/反选的简单代码
jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3.1.js–>测试通过,jquery-1.5.1.js–>测试不通过. 实现CheckBox全选/全不选/反选代码如下: <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional
-
jQuery实现checkbox全选、反选及删除等操作的方法详解
本文实例讲述了jQuery实现checkbox全选.反选及删除等操作的方法.分享给大家供大家参考,具体如下: 运行效果: 1.list.html 说明:用checkbox数组Check[]存放每一行的ID值 <div id="con"> <table width="100%" cellspacing="1" cellpadding="0"> <tr> <th><input
-
jQuery实现checkbox全选的方法
本文实例讲述了jQuery实现checkbox全选的方法.分享给大家供大家参考.具体分析如下: 通过checkbox 进行全选和取消全选的操作,如果通过toggle进行处理,则会出现checkbox无法显示对勾的问题. 使用click事件,根据checked属性进行判断即可. 示例: $("#chkRreviewOffline").click(function(){ if(this.checked){ $('#review-offline .btn_checkbox input[typ
-
jQuery实现CheckBox全选、全不选功能
废话不多说了,直接给大家贴代码了,具体代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>jQuery实现CheckBox全选.全不选</title> <script src="http://code.jquery.com/jquery-2.2.3.min.js" type="text/jav
-
基于jQuery的checkbox全选问题分析
本文实例分析了基于jQuery的checkbox全选问题.分享给大家供大家参考,具体如下: 最近开发项目时遇到一个很奇怪的问题,就是checkbox的全选与全不选 使用jQuery的框架.一直是使用 //检测选中的checkbox $('input[name="abc"]:checked').each(function(){}) 但是,发现我需要全选的时候,使用 $('input[name="abc"]').attr('checked',true); $('inpu
-
jQuery实现checkbox全选功能完整实例
本文实例讲述了jQuery实现checkbox全选功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <title>www.jb51.net jQuery实现checkBox全选</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.
-
jQuery 更改checkbox的状态,无效的解决方法
今天写页面遇到复选框动态全选或全不选问题,正常写法如下: $("#tb").find("input[type='checkbox']").attr("checked","checked"); but!第一次点击全选按钮input显示对勾,第二次就不行了,查了下有建议用prop的,亲测有效.那两者有啥区别呢? jQuery函数attr()和prop()的区别: 1.操作对象不同 "attr"和"pr
-
javascript中CheckBox全选终极方案
在我们的程序开发中经常会要用到CheckBox的全选,通常情况下是在一些数据绑定控件中如Gridview等 下面以Repeater为例,在Repeater的header 和item中放入CheckBox控件 . <asp:Repeater ID="rptGroup" runat="server"> <HeaderTemplate> <table width="100%" cellspacing="1&quo
-
Jquery 实现checkbox全选方法
昨天早上有写到怎么利用Jquery实现全选 根据大家的意见对程序中一些写法不好的地方进行了修改,也是本人水平有限,存在各种考虑不到的地方. 文章最后我提出了一个问题,要写一个通用的方法来调用,于是就有了现在的这篇文章,晚上回到家,我就写出了效果 下面的例子可以供大家讨论学习,如果觉得不错也可以直接应用到项目中. 1:为什么要写这个方法 网上实现一句话全选全不选的有很多,但是好像都忽略了一个问题,全选的checkbox可以控制下面的子checkbox,但是下面的子checkbox应该也可以控制上面
随机推荐
- php+mysql实现简单的增删改查功能
- RadioButtonList绑定图片及泛型Dictionary应用
- JS简单判断字符在另一个字符串中出现次数的2种常用方法
- 基于PHP实现假装商品限时抢购繁忙的效果
- Android 开发环境配置问题
- PHP实现批量重命名某个文件夹下所有文件的方法
- 六酷社区论坛HOME页清新格调免费版 下载
- 深入理解JavaScript高级之词法作用域和作用域链
- 深入学习Python中的装饰器使用
- 优化Python代码使其加快作用域内的查找
- Python使用struct处理二进制的实例详解
- php 如何设置一个严格控制过期时间的session
- node.js 利用流实现读写同步,边读边写的方法
- 2006.12.06更新 TopStyle剪辑库
- 基于jQuery滑动杆实现购买日期选择效果
- 求解开jscript.encode代码的asp函数
- 多个表单中如何获得这个文件上传的网址实现js代码
- PHP URL参数获取方式的四种例子
- 网上邻居找不到其他计算机方案
- 从vue基础开始创建一个简单的增删改查的实例代码(推荐)