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 DOM事件模型的两件事
Jul 22 Javascript
jquery 学习之二 属性(类)
Nov 25 Javascript
Jquery截取中文字符串的实现代码
Dec 22 Javascript
基于Jquery的开发个代阴影的对话框效果代码
Jul 28 Javascript
jquery中使用ajax获取远程页面信息
Nov 13 Javascript
javascript-简单的计算器实现步骤分解(附图)
May 30 Javascript
json数据与字符串的相互转化示例
Sep 18 Javascript
JavaScript中的parse()方法使用简介
Jun 12 Javascript
举例讲解Node.js中的Writable对象
Jul 29 Javascript
jquery ui dialog替代confirm实例分析
Jan 25 Javascript
bootstrap导航栏、下拉菜单、表单的简单应用实例解析
Jan 06 Javascript
还不懂递归?读完这篇文章保证你会懂
Jul 29 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
用文本文件制作留言板提示(上)
2006/10/09 PHP
php 数据库字段复用的基本原理与示例
2011/07/22 PHP
浅析Yii2 GridView实现下拉搜索教程
2016/04/22 PHP
Yii1.1框架实现PHP极光推送消息通知功能
2018/09/06 PHP
PHP读取Excel内的图片(phpspreadsheet和PHPExcel扩展库)
2019/11/19 PHP
JavaScript中yield实用简洁实现方式
2010/06/12 Javascript
javascript中字符串拼接需注意的问题
2010/07/13 Javascript
javascript自适应宽度的瀑布流实现思路
2013/02/20 Javascript
jQuery实现页面滚动时层智能浮动定位实例探讨
2013/03/29 Javascript
javascript根据像素点取位置示例
2014/01/27 Javascript
Javascript解析URL方法详解
2014/12/05 Javascript
jQuery调用ajax请求的常见方法汇总
2015/03/24 Javascript
D3.js实现散点图和气泡图的方法详解
2016/09/21 Javascript
Javascript 创建类并动态添加属性及方法的简单实现
2016/10/20 Javascript
jquery精度计算代码 jquery指定精确小数位
2017/02/06 Javascript
JS实现简易换图时钟功能分析
2018/01/04 Javascript
[41:05]Serenity vs Pain 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
python 正则式 概述及常用字符
2009/05/07 Python
Python中__init__.py文件的作用详解
2016/09/18 Python
python的继承知识点总结
2018/12/10 Python
python+selenium实现QQ邮箱自动发送功能
2019/01/23 Python
Django中使用CORS实现跨域请求过程解析
2019/08/05 Python
python3使用Pillow、tesseract-ocr与pytesseract模块的图片识别的方法
2020/02/26 Python
如何清空python的变量
2020/07/05 Python
python利用proxybroker构建爬虫免费IP代理池的实现
2021/02/21 Python
css和css3弹性盒模型实现元素宽度(高度)自适应
2019/05/15 HTML / CSS
Hotels.com爱尔兰:全球酒店预订
2017/02/24 全球购物
意大利中国电子产品购物网站:Geekmall.com
2019/09/30 全球购物
生物化学研究助理员求职信
2013/10/09 职场文书
个人批评与自我批评总结
2014/10/17 职场文书
二年级语文下册复习计划
2015/01/19 职场文书
三好学生个人总结
2015/02/15 职场文书
幼儿园六一主持词开场白
2015/05/28 职场文书
2016年基层党支部书记公开承诺书
2016/03/25 职场文书
JPA如何使用entityManager执行SQL并指定返回类型
2021/06/15 Java/Android
详解CSS中的特指度和层叠问题
2021/07/15 HTML / CSS