checkbox全选失效

先写一段全选的代码

 //全选、全不选
    $("#currentPageAllOrders").bind({
         click : function(){
             var allOrdersChecked = $(this).is(":checked")
             $("input[name='selectedId']").each(function () {
                 $(this).attr("checked",allOrdersChecked);
             })
          }
     });

页面效果如下

我们F12看了一下页面代码,是没有选中状态,符合预期

我们点击全选前面的选框,发现页面全选中了,这是我们想要的,这个时候我们再看看代码,多了一个checked=“checked",符合预期

接下来点取消,发现页面中的 checked="checked"消失,符合预期

这个时候,注意啦,当我们再次点击全选的时候,我们发现额,页面中没有选中效果,但是代码中却有 checked="checked"

神奇啊,哭笑不得

后来经过研究发现,jquery1.6开始添加了一个新的方法prop,至于这个方法的详细情况,各位可以问度娘

解决方案

ok  问题解决了(为了赶时髦,我用的是jquery1.11,罪过罪过)



版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-10-12 21:47:54

checkbox全选失效的相关文章

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

这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下 如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将获得一个属性(attribute) ,它不改变该复选框被选中和选中.它只是用来存储默认或选中属性的初始值.为了保持向后兼容,.attr() 方法从 jQuery 1.6.1+ 开始除了返回属性值外,还会更新 property 属性,因此 boolean attribute(布尔属性)不需要通过 .prop(

关于input[type='checkbox']全选的问题

今天在做一个全选功能的时候,发现了一个问题,就是如果我在选择全选之前,我就已经选择了一个input,然后我再去选择全选并且以后再取消全选的时候,这个我之前选择的input始终处于选择状态,但是他的checked的值一直是在true和false之间变化,当checked=false的时候,仍然是被选中的.到现在还没处理好这个问题.希望看到的哪位大神能给个好的解决办法,实在感激.下面是类似的代码. <!DOCTYPE html><html lang="en"><

利用jQuery实现CheckBox全选/全不选/反选

转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3.1.js–>测试通过,jquery-1.5.1.js–>测试不通过. 实现CheckBox全选/全不选/反选代码如下: <%@ page language="java" pageEncoding="UTF-8"%>   <!DOCTYPE

js初学—实现checkbox全选功能

布局如下: <p ><input type="checkbox" id="che1"/>全选</p><div id="div1"> <input type="checkbox" /><br /> <input type="checkbox" /><br /> <input type="checkb

checkbox 全选,反选 ,全不选

在表格或者列表中经常会遇到要全选或者反选等交互,今天总结了一下代码,保留着以后直接拿来用 原理: 1. 全选:当全选checkbox被点击(不管点击之前是什么状态)后,获取其checked状态.然后对列表进行循环检测,此时可以将所有的(无论之前什么状态),设为选中,也可对未选中的进行选中. 2. 反选:当反选checkbox被点击(不管点击之前是什么装填)后,获取其其状态值,对列表进行循环检测,将被检测的元素的checked状态反向处理,即可. 3. 列表全选或者不全选:当列表中的任意一个che

jQuery设置checkbox全选(区别jQuery版本)

jQuery设置checkbox全选在网上有各种文章介绍,但是为什么在我们用他们的代码的时候就没有效果呢? 如果你的代码一点错误都没有,先不要急着怀疑人家代码的正确性,也许只是人家跟你用的jQuery版本不同而已. jQuery很多版本都会对一些小的功能做一些改进,比如checkbox的选中. jQuery对checkbox改动的界线版本 jquery1.9.1. jquery1.9.1之前,全选是这样的: $('#checkbox').attr('checked',true) $('#chec

Jquery 组checkbox全选checkbox

<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title></title> <style> </style></head><body><form action=""> <input type="checkbox&quo

表单javascript checkbox全选 反选 全不选

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>javascript checkbox全选 反选 全不选</title> <meta name="des

jQuery --checkbox全选和取消全选简洁高效的解决办法

最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二. html代码如下: <fieldset data-role="controlgroup">  <label><input type="checkbox" name="boxes" id="select_al