JQuery CheckBox(复选框)操作方法汇总


Posted in Javascript onApril 15, 2015

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

            }

     });

或者
('input:checkbox').map(function () {             

   return(this).val();

}).get().join(',') ;

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 相关文章推荐
location.href 在IE6中不跳转的解决方法与推荐使用代码
Jul 08 Javascript
javascript实现的使用方向键控制光标在table单元格中切换
Nov 17 Javascript
Jquery异步请求数据实例代码
Dec 28 Javascript
javascript生成随机大小写字母的方法
Feb 20 Javascript
jQuery实现的仿select功能代码
Aug 19 Javascript
简单谈谈javascript Date类型
Sep 06 Javascript
详解JavaScript中基于原型prototype的继承特性
May 05 Javascript
关于backbone url请求中参数带有中文存入数据库是乱码的快速解决办法
Jun 13 Javascript
JS获取当前使用的浏览器名字以及版本号实现方法
Aug 19 Javascript
vue.js树形组件之删除双击增加分支实例代码
Feb 28 Javascript
js实现图片懒加载效果
Jul 17 Javascript
Javascript Dom元素获取和添加详解
Sep 24 Javascript
JQuery select(下拉框)操作方法汇总
Apr 15 #Javascript
JavaScript控制网页层收起和展开效果的方法
Apr 15 #Javascript
JS扩展方法实例分析
Apr 15 #Javascript
JavaScript实现简单的二级导航菜单实例
Apr 15 #Javascript
JQuery radio(单选按钮)操作方法汇总
Apr 15 #Javascript
JavaScript判断前缀、后缀是否是空格的方法
Apr 15 #Javascript
JQuery控制radio选中和不选中方法总结
Apr 15 #Javascript
You might like
php上传功能集后缀名判断和随机命名(强力推荐)
2015/09/10 PHP
Javascript的IE和Firefox兼容性汇编
2006/07/01 Javascript
SlideView 图片滑动(扩展/收缩)展示效果
2010/08/01 Javascript
js 取时间差去掉周六周日实现代码
2012/12/25 Javascript
Extjs4 GridPanel 的几种样式使用介绍
2013/04/18 Javascript
阻止子元素继承父元素事件具体思路及实现
2013/05/02 Javascript
jQuery实现加入购物车飞入动画效果
2015/03/14 Javascript
Java中int与integer的区别(基本数据类型与引用数据类型)
2017/02/19 Javascript
js实现抽奖效果
2017/03/27 Javascript
NodeJS收发GET和POST请求的示例代码
2017/08/25 NodeJs
JS基于对象的特性实现去除数组中重复项功能详解
2017/11/17 Javascript
r.js来合并压缩css文件的示例
2018/04/26 Javascript
如何实现小程序tab栏下划线动画效果
2019/05/18 Javascript
微信小程序实现多行文字滚动
2020/11/18 Javascript
[43:49]LGD vs CHAOS 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
[46:37]LGD vs TNC 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python正则表达式判断字符串是否是全部小写示例
2013/12/25 Python
Python装饰器的函数式编程详解
2015/02/27 Python
python tkinter窗口最大化的实现
2019/07/15 Python
TensorFlow通过文件名/文件夹名获取标签,并加入队列的实现
2020/02/17 Python
pycharm实现print输出保存到txt文件
2020/06/01 Python
Python获取android设备cpu和内存占用情况
2020/11/15 Python
python 实现Requests发送带cookies的请求
2021/02/08 Python
英国度假别墅预订:Sykes Cottages
2017/06/12 全球购物
Lookfantastic挪威官网:英国知名美妆购物网站
2017/07/26 全球购物
Nike西班牙官方网站:Nike.com (ES)
2017/10/30 全球购物
教师的实习鉴定
2013/12/15 职场文书
小学教师事迹材料
2014/01/13 职场文书
高中军训广播稿
2014/01/14 职场文书
自动一体化专业求职信
2014/03/15 职场文书
新品发布会策划方案
2014/06/08 职场文书
软环境建设心得体会
2014/09/09 职场文书
党支部三严三实对照检查材料思想汇报
2014/09/29 职场文书
七年级英语教学反思
2016/02/15 职场文书
《鸡兔同笼》教学反思
2016/02/19 职场文书
SQL中的连接查询详解
2022/06/21 SQL Server