jquery操作复选框(checkbox)的12个小技巧总结


Posted in Javascript onFebruary 04, 2014

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);
});

Javascript 相关文章推荐
jQuery 表单验证扩展代码(二)
Oct 20 Javascript
JavaScript onkeypress事件入门实例(按下或按住一个键盘按键)
Oct 17 Javascript
javascript获取当前鼠标坐标的方法
Jan 10 Javascript
百度地图API之本地搜索与范围搜索
Jul 30 Javascript
js图片卷帘门导航菜单特效代码分享
Sep 10 Javascript
谈谈JSON对象和字符串之间的相互转换JSON.stringify(obj)和JSON.parse(string)
Oct 01 Javascript
AngularJs页面筛选标签小功能
Aug 01 Javascript
JavaScript注入漏洞的原理及防范(详解)
Dec 04 Javascript
bootstrap快速制作后台界面
Dec 05 Javascript
详解基于 Nuxt 的 Vue.js 服务端渲染实践
Oct 24 Javascript
详解在Javascript中进行面向切面编程
Apr 28 Javascript
微信小程序 下拉刷新及上拉加载原理解析
Nov 06 Javascript
jquery 获取dom固定元素 添加样式的简单实例
Feb 04 #Javascript
jquery判断元素的子元素是否存在的示例代码
Feb 04 #Javascript
jquery中get,post和ajax方法的使用小结
Feb 04 #Javascript
jquery中get和post的简单实例
Feb 04 #Javascript
jquery中$.post()方法的简单实例
Feb 04 #Javascript
用jQuery与JSONP轻松解决跨域访问的问题
Feb 04 #Javascript
jquery的ajax和getJson跨域获取json数据的实现方法
Feb 04 #Javascript
You might like
丧钟首部独立剧集《丧钟:骑士与龙》北美正式开播,场面血腥
2020/04/09 欧美动漫
php操作JSON格式数据的实现代码
2011/12/24 PHP
PHP和JAVA中的重载(overload)和覆盖(override) 介绍
2012/03/01 PHP
一个基于phpQuery的php通用采集类分享
2014/04/09 PHP
文字幻灯片
2006/06/26 Javascript
Prototype使用指南之string.js
2007/01/10 Javascript
jQuery 解析xml文件
2009/08/09 Javascript
JavaScript 字符串乘法
2009/08/20 Javascript
niceTitle 基于jquery的超链接提示插件
2010/05/31 Javascript
关于include标签导致js路径找不到的问题分析及解决
2013/07/09 Javascript
jQuery实现点击小图显示大图代码分享
2015/08/25 Javascript
jQuery插件实现无缝滚动特效
2015/11/24 Javascript
微信小程序 wx.login解密出现乱码的问题解决办法
2017/03/10 Javascript
JS分页的实现(同步与异步)
2017/09/16 Javascript
vue2.0实现前端星星评分功能组件实例代码
2018/02/12 Javascript
vue.js 实现a标签href里添加参数
2019/11/12 Javascript
nuxt.js写项目时增加错误提示页面操作
2020/11/05 Javascript
[02:57]DOTA2亚洲邀请赛 SECRET战队出场宣传片
2015/02/07 DOTA
python中matplotlib的颜色及线条控制的示例
2018/03/16 Python
Python 内置函数进制转换的用法(十进制转二进制、八进制、十六进制)
2018/04/30 Python
Python实现E-Mail收集插件实例教程
2019/02/06 Python
python爬虫租房信息在地图上显示的方法
2019/05/13 Python
python PIL和CV对 图片的读取,显示,裁剪,保存实现方法
2019/08/07 Python
pytorch使用tensorboardX进行loss可视化实例
2020/02/24 Python
手把手教你安装Windows版本的Tensorflow
2020/03/26 Python
HTML5拖放功能_动力节点Java学院整理
2017/07/13 HTML / CSS
Mamas & Papas沙特阿拉伯:英国最受欢迎的婴儿品牌
2017/11/20 全球购物
幼儿教师考核制度
2014/01/25 职场文书
宣传部部长竞选演讲稿
2014/04/26 职场文书
王兆力在市委党的群众路线教育实践活动总结大会上的讲话稿
2014/10/25 职场文书
关于颐和园的导游词
2015/01/30 职场文书
检讨书之工作不认真
2019/08/14 职场文书
建国70周年的心得体会(2篇)
2019/09/20 职场文书
Java用自带的Image IO给图片添加水印
2021/06/15 Java/Android
十大冰系宝可梦排名,颜值最高的阿罗拉九尾,第三使用率第一
2022/03/18 日漫
Ruby序列化和持久化存储 Marshal和Pstore介绍
2022/04/18 Ruby