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 相关文章推荐
JavaScript 高级篇之闭包、模拟类,继承(五)
Apr 07 Javascript
js中的前绑定和后绑定详解
Aug 01 Javascript
JS和函数式语言的三特性
Mar 05 Javascript
javascript 获取浏览器版本
Jan 21 Javascript
Javascript 拖拽雏形(逐行分析代码,让你轻松了拖拽的原理)
Jan 23 Javascript
使用jspdf生成pdf报表
Jul 03 Javascript
一系列Bootstrap导航条使用方法分享
Apr 29 Javascript
深入理解jQuery layui分页控件的使用
Aug 17 Javascript
微信小程序 Template详解及简单实例
Jan 05 Javascript
JavaScript上传文件时不用刷新页面方法总结(推荐)
Aug 15 Javascript
vue按需加载实例详解
Sep 06 Javascript
在Vue项目中使用Typescript的实现
Dec 19 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
ajax+php打造进度条代码[readyState各状态说明]
2010/04/12 PHP
php ajax 静态分页过程形式
2011/09/02 PHP
PHP批量去除BOM头代码分享
2015/06/26 PHP
php如何获取文件的扩展名
2015/10/28 PHP
PHPStorm+XDebug进行调试图文教程
2016/06/13 PHP
php实现基于openssl的加密解密方法
2016/09/30 PHP
PHP实现登陆并抓取微信列表中最新一组微信消息的方法
2017/07/10 PHP
php ajax数据传输和响应方法
2018/08/21 PHP
php和html的区别点详细总结
2019/09/24 PHP
ASP Json Parser修正版
2009/12/06 Javascript
仅IE6/7/8中innerHTML返回值忽略英文空格的问题
2011/04/07 Javascript
jQuery EasyUI API 中文文档 - Calendar日历使用
2011/10/19 Javascript
Js,alert出现乱码问题的解决方法
2013/06/19 Javascript
浅析JavaScript中的常用算法与函数
2013/11/21 Javascript
微信小程序 条件渲染详解
2016/10/09 Javascript
详解Puppeteer 入门教程
2018/05/09 Javascript
JavaScript笛卡尔积超简单实现算法示例
2018/07/30 Javascript
vuedraggable+element ui实现页面控件拖拽排序效果
2020/07/29 Javascript
javascript实现摄像头拍照预览
2019/09/30 Javascript
整理 node-sass 安装失败的原因及解决办法(小结)
2020/02/19 Javascript
Python输出汉字字库及将文字转换为图片的方法
2016/06/04 Python
Python的Asyncore异步Socket模块及实现端口转发的例子
2016/06/14 Python
Django框架创建项目的方法入门教程
2019/11/04 Python
Python 时间戳之获取整点凌晨时间戳的操作方法
2020/01/28 Python
python 装饰器功能与用法案例详解
2020/03/06 Python
Anaconda的安装与虚拟环境建立
2020/11/18 Python
使用 css3 实现圆形进度条的示例
2017/07/05 HTML / CSS
捷克原创男装和女装购物网站:Bolf.cz
2018/04/28 全球购物
线程同步的方法
2016/11/23 面试题
交通专业个人自荐信格式
2013/09/23 职场文书
班长自荐书范文
2014/02/11 职场文书
环境建设实施方案
2014/03/14 职场文书
销售员试用期自我评价
2014/09/15 职场文书
安全保证书怎么写
2015/02/28 职场文书
担保书格式范文
2015/09/22 职场文书
2016年村党支部公开承诺书
2016/03/24 职场文书