jQuery控制checkbox选中状态但是不显示选中
问题描述:使用jQuery来控制checkbox的选中状态,但是第一次点击出现选中样式,之后点击可以看到checked的属性增加成功但是并没有选
中状态。
问题代码:
function chooseAllOrNot(id){
var choose=$("input[name='"+id+"']").attr('checked');
if(choose=='checked'){
$("input[type=checkbox][name='"+id+"']").removeAttr('checked');
choose=$("input[name='"+id+"']").attr('checked');
}else{
$("input[type=checkbox][name='"+id+"']").attr('checked', 'true');
choose=$("input[name='"+id+"']").attr('checked');
}
}
解决方法:
function chooseAllOrNot(id){
var choose=$("input[name='"+id+"']").prop('checked');
if(choose){
$("input[type=checkbox][name='"+id+"']").removeProp('checked');
choose=$("input[name='"+id+"']").prop('checked');
}else{
$("input[type=checkbox][name='"+id+"']").prop('checked', true);
choose=$("input[name='"+id+"']").prop('checked');
}
}
或者使用javascript原生代码来实现
var fir = document.getElementsByName("name");
for(var i=fir;i<fir.length;i++){
fir[i].checked = true;
}
总结:使用attr()给属性checked赋值,发现无论赋予什么值,只要给这个属性赋值了就是选中状态,使用.attr('checked', 'true');
和.attr('checked', 'false'),结果都是选中状态,可以使用attr()和removeAttr(),或者使用.attr('checked', true);和.attr
('checked', false),但是使用attr()出现了只有第一次会出现选中和取消选中的状态,后面点击没有选中状态但是代码显示对checked属性控制成
功的,只能改为使用prop()或者使用javascript原生代码来控制,才不会出现上述情况。
附:
什么时候使用attr(),什么时候使用prop()?
1.添加属性名称该属性就会生效应该使用prop();
2.是有true,false两个属性使用prop();
3.其他则使用attr();
jQuery控制checkbox选中状态但是不显示选中的更多相关文章
- jQuery 更改checkbox的状态,无效
今天写页面遇到复选框动态全选或全不选问题,正常写法如下: $("#tb").find("input[type='checkbox']").attr(" ...
- jQuery实现checkbox(复选框)选中、全选反选代码
谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...
- jquery关于checkbox复选框是否被选中的问题
本人在项目中需要用到,判断哪些复选框被用户选中.自然而然想到用 if($('').attr('checked') == true) 但是不管有没有选,$('').attr('checked')返回的都 ...
- jquery 获取 CheckBox 的状态
<td style="width:220px;vertical-align:central;"><input type="checkbox" ...
- 实现CheckBox的三种选中状态(全选、半选、不选)在GridView中模拟树形的功能
度娘了很多帖子,只说三种状态要用图片替换来做,但没找到有用的例子,被逼自己写了一个 三方控件肯定是很多的,如jstree,可以直接用 由于公司的UDS限制,不能上传图片,只能文字说明了. 就是要在gr ...
- Jquery判断checkbox是否被选中
jQuery中: $("input[type='checkbox']").is(':checked') 返回true或false 1.attr()方法 设置或者返回备选元素的值 ...
- Dtree 添加 checkbox 复选框 可以默认选中
一:目标 要实现用一个树形结构的展示数据,每个节点(除了根节点)前有一个checkbox,同时,点击父节点,则子节点全选或者全不选,当选中了全部子节点,父节点选中:如下图所示: 同时可以在创建的时候, ...
- 关于JQuery设置checkbox checked 的问题
近日做一个关于JQuery表单验证,有一个比较奇葩的要求,即checkbox是为必填项,textbox不是必填的. 而checkbox与textbox又是相关的,填写了textbox,则其上方的che ...
- JQuery遍历CheckBox踩坑记
$("#checkbox_id").attr("checked"); //获取一个CheckBox的状态(有没有被选中,返回true/false) $(&quo ...
随机推荐
- Atitit.mssql 数据库表记录数and 表体积大小统计
Atitit.mssql 数据库表记录数and 表体积大小统计 1. EXEC sp_MSforeachtable "EXECUTE sp_spaceused '?'&quo ...
- atitit.商业版 源码保护 与 java本地原生代码转换 的方案总结
atitit.商业版 源码保护 与 java本地原生代码转换 的方案总结 1. 为什么虚拟机语言容易被反编译 1 2. 源码泄露的问题问题 1 3. Excelsior JET 1 4. gcj.的流 ...
- spring 发布 Jax-Ws Service (二)
Service import javax.jws.WebMethod; import javax.jws.WebParam; import javax.jws.WebResult; import ja ...
- JS 利用正则表达式替换字符串
JS 利用正则表达式替换字符串 博客分类: JavaScript 学习资料 Java代码 收藏代码 JS 利用正则表达式替换字符串 var data = "123123,213,12312, ...
- Angular+Electron+VSCode的桌面应用
Angular+Electron+VSCode的桌面应用 转自:http://blog.csdn.net/yr7942793/article/details/50986696 第一部分 Electro ...
- Roslyn介绍
介绍 一般来说,编译器是一个黑箱,源代码从一端进入,然后箱子中发生一些奇妙的变化,最后从另一端出来目标文件或程序集.编译器施展它们的魔法,它们必须对所处理的代码进行深入的理解,不过相关知识不是每个人都 ...
- scala,spark练习题提高
1.求每家公司有哪些产品 val arr3 = List("Apache" -> "Spark", "Apache" -> &q ...
- [接口]mmc/eMMC/SD-card
转自:http://blog.csdn.net/yazhouren/article/details/46643321 MMC(multiMedia card)是一种通信协议,支持两种模式SPI和MMC ...
- HTML5关于上传API的一些使用(下)
通过前面两篇的分享,我们已经搞定了单个文件的普通的上传,包括文件预览,图片预览,上传速度等前端界面的显示,这次我们来谈谈关于>XMLHttpRequest2.0在界面之后假如才用分片上传能做到一 ...
- dp - HNU 13404 The Imp
The Imp Problem's Link: http://acm.hnu.cn/online/?action=problem&type=show&id=13404&cour ...