jquery操作复选框(checkbox)的一些小技巧总结
1、获取单个checkbox选中项(三种写法)
//第一种
$("input:checkbox:checked").val()
//第二种
$("input:[type='checkbox']:checked").val();
//第三种
$("input:[name='ck']:checked").val();
2、 获取多个checkbox选中项
$('input:checkbox').each(function() {
if ($(this).attr('checked') ==true) {
alert($(this).val());
}
});
3、设置第一个checkbox 为选中值
//第一种
$('input:checkbox:first').attr("checked",'checked');
//第二种
$('input:checkbox').eq(0).attr("checked",'true');
4、设置最后一个checkbox为选中值
//第一种
$('input:radio:last').attr('checked', 'checked');
//第二种
$('input:radio:last').attr('checked', 'true');
5、根据索引值设置任意一个checkbox为选中值
//第一种
$('input:checkbox).eq(索引值).attr('checked', 'true');索引值=0,1,2....
//第二种
$('input:radio').slice(1,2).attr('checked', 'true');
6、选中多个checkbox同时选中第1个和第2个的checkbox
$('input:radio').slice(0,2).attr('checked','true');
7、根据Value值设置checkbox为选中值
$("input:checkbox[value='1']").attr('checked','true');
8、删除Value=1的checkbox
$("input:checkbox[value='1']").remove();
9、删除第几个checkbox
$("input:checkbox").eq(索引值).remove();//索引值=0,1,2....
//如删除第3个checkbox:
$("input:checkbox").eq(2).remove();
10、遍历checkbox
$('input:checkbox').each(function (index, domEle) {
//写入代码
});
11、全部选中
$('input:checkbox').each(function() {
$(this).attr('checked', true);
});
12、全部取消选择
$('input:checkbox').each(function () {
$(this).attr('checked',false);
});
13、checkbox标签已有checked=checked但是不显示勾选
checkbox标签已有checked=checked但是不显示勾选,解决办法就是将 $("...").attr("checked", true)改为$("...").prop("checked", true)。
JQuey中的 attr()函数和prop()函数,attr()是处理 attribute的值的,而prop()是处理 property 的值的 ,jQuery 1.6之前 ,.attr()方法在取某些 attribute 的值时,会返回 property 的值,这就导致了结果的不一致。从 jQuery 1.6 开始, .prop()方法 方法返回 property 的值,而 .attr() 方法返回 attributes 的值,那么归根结底,就是在处理 attribute 和 property。
很多attribute节点有一个相应的property属性,因而attribute和property很容易被混淆在一起,如某个div元素中的id和class既是attribute也有property,不管哪种方式都可以访问和修改,但是对于自定义的attribute节点,或者自定义property,两者就没有关系了(但是在IE6-7中,两者还是一样的,但愿我们都能早日抛弃IE8以下的),需要注意的是,对于checked特性(attribute)不是对应它checked属性(property),attribute实际对应的是defaultChecked属性,而且仅用于设置复选框最初的值,checked的attribute不会因为复选框的状态而改变,而checked的property会因为复选框的状态而改变,所以在.attr()函数中,就算设置成了.attr("checked",
true),也只是用来存储默认或者选中属性的默认值,却并不改变该复选框被选中和选中,这就是为什么
checkbox标签已有checked=checked但是不显示勾选 的原因所在。
//.attr('checked');看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false
//.prop('checked'); //16+:true/false
//.is(':checked'); //所有版本:true/false//别忘记冒号
jquery操作复选框(checkbox)的一些小技巧总结的更多相关文章
- jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等
转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...
- jquery操作复选框(checkbox)十二技巧
jquery操作复选框(checkbox)的12个小技巧. 1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$( ...
- Jquery操作复选框(CheckBox)的取值赋值实现代码
赋值 复选框 CheckBox 遍历 取值 1. 获取单个checkbox选中项(三种写法): $("input:checkbox:checked").val() 或者 $(&q ...
- jQuery 操作复选框(checkbox) attr checked不起作用
参考资料 http://www.paobuke.com/develop/javascript/pbk849.html 这天用到jQuery功能,想实现一个简单的复选框动态全选或全不选,结果测试发现 ...
- jQuery——操作复选框(checkbox) attr checked不起作用
这天用到jQuery功能,想实现一个简单的复选框动态全选或全不选,结果测试发现 attr(‘checked’,'checked’);与attr(‘checked’,true); 都不好使,要么第一次成 ...
- jquery操作复选框(checkbox)的12个小技巧总结
1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$("input:[type='checkbox']: ...
- jquery操作复选框(checkbox)
1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$("input:[type='checkbox']: ...
- 对jquery操作复选框
摘要:jquery操作复选框.使用更简洁易懂,思路清晰,逻辑更明了,很实用 <!DOCTYPE html> <html> <head> <meta chars ...
- jquery判断复选框checkbox是否被选中
jquery判断复选框checkbox是否被选中 使用is方法 //如果选中返回true //如果未选中返回false .is(':checked');
随机推荐
- python 浅谈小数据池和编码
⼀. ⼩数据池 在说⼩数据池之前. 我们先看⼀个概念. 什么是代码块: 根据提示我们从官⽅⽂档找到了这样的说法: A Python program is constructed from code b ...
- 【大数据技术】HBase与Solr系统架构设计
如何在保证存储量的情况下,又能保证数据的检索速度. HBase提供了完善的海量数据存储机制,Solr.SolrCloud提供了一整套的数据检索方案. 使用HBase搭建结构数据存储云,用来存储海量数据 ...
- SQL UPDATE 语句
Update 语句 Update 语句用于修改表中的数据. 语法: UPDATE 表名称 SET 列名称 = 新值 WHERE 列名称 = 某值 Person: LastName FirstName ...
- centos7下安装docker(16.1docker跨主机存储--Rex-Ray)
一.Rex-Ray以standalone进程的方式运行在docker主机上,安装方法很简单:在docker1和docker2上运行如下命令: curl -sSL https://dl.bintray. ...
- BZOJ2124:等差子序列(线段树,hash)
Description 给一个1到N的排列{Ai},询问是否存在1<=p1<p2<p3<p4<p5<…<pLen<=N (Len>=3), 使得A ...
- 小a与星际探索
链接:https://ac.nowcoder.com/acm/contest/317/C来源:牛客网 小a正在玩一款星际探索游戏,小a需要驾驶着飞船从11号星球出发前往nn号星球.其中每个星球有一个能 ...
- linux stat 查看文件的详细信息
linux stat查看文件详细信息 [root@oldboy01 tmp]# stat /tmp/1.cc File: `/tmp/1.cc' Size: 4 Blocks: 8 IO Block: ...
- esp8266 免费wifi强推广告神器(0) 项目介绍
某宝产品 WIFI SSID广告终端路由推广宝 简单来说,手机连接免费wifi,自动弹出广告页面,有二维码和电话,点击电话直接打电话给商家客服,用户点击链接跳转到商家网页. 同时存在设置页面,使用者可 ...
- leetcode 557. Reverse Words in a String III 、151. Reverse Words in a String
557. Reverse Words in a String III 最简单的把空白之间的词反转 class Solution { public: string reverseWords(string ...
- AI numpy
nan:not a number inf:infinate arange(start, stop, step):[start, stop),step是步长的数组 sin:正弦函数 cos:余弦函数