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 相关文章推荐
jQuery 方法大全方便学习参考
Feb 25 Javascript
javascript之学会吝啬 精简代码
Apr 25 Javascript
JQuery获取文本框中字符长度的代码
Sep 29 Javascript
jquery中append()与appendto()用法分析
Nov 14 Javascript
node.js中的http.response.addTrailers方法使用说明
Dec 14 Javascript
Javascript实现多彩雪花从天降散落效果的方法
Feb 02 Javascript
JavaScript中获取HTML元素值的三种方法
Jun 20 Javascript
利用纯JS实现像素逐渐显示的方法示例
Aug 14 Javascript
vue实现验证码按钮倒计时功能
Apr 10 Javascript
详解vue数组遍历方法forEach和map的原理解析和实际应用
Nov 15 Javascript
vue-cropper插件实现图片截取上传组件封装
May 27 Vue.js
javascript的var与let,const之间的区别详解
Feb 18 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中将数组转成字符串并保存到数据库中的函数代码
2013/09/29 PHP
php实现最简单的MVC框架实例教程
2014/09/08 PHP
PHP批量去除BOM头内容信息代码
2016/03/11 PHP
php中foreach结合curl实现多线程的方法分析
2016/09/22 PHP
jQuery Tools tab(幻灯片)
2012/07/14 Javascript
Node.js开源应用框架HapiJS介绍
2015/01/14 Javascript
JavaScript数组随机排列实现随机洗牌功能
2015/03/19 Javascript
限制只能输入数字的实现代码
2016/05/16 Javascript
JavaScript字符串对象(string)基本用法示例
2017/01/18 Javascript
canvas+gif.js打造自己的数字雨头像的示例代码
2017/10/26 Javascript
基于Vue制作组织架构树组件
2017/12/06 Javascript
vue 指定组件缓存实例详解
2018/04/01 Javascript
微信小程序实现的自定义分享功能示例
2019/02/12 Javascript
详解Nodejs get获取远程服务器接口数据
2019/03/26 NodeJs
浅谈Vue.set实际上是什么
2019/10/17 Javascript
使用jQuery实现掷骰子游戏
2019/10/24 jQuery
JavaScript函数重载操作实例浅析
2020/05/02 Javascript
JavaScript数组排序的六种常见算法总结
2020/08/18 Javascript
Python实现随机选择元素功能
2017/09/14 Python
扩展Django admin的list_filter()可使用范围方法
2019/08/21 Python
Python实现朴素贝叶斯的学习与分类过程解析
2019/08/24 Python
PyQt5 closeEvent关闭事件退出提示框原理解析
2020/01/08 Python
浅谈图像处理中掩膜(mask)的意义
2020/02/19 Python
windows、linux下打包Python3程序详细方法
2020/03/17 Python
使用css3背景渐变中的透明度来设置不同颜色的背景渐变
2014/03/31 HTML / CSS
CSS3常用的几种颜色渐变模式总结
2016/11/18 HTML / CSS
应届生幼儿园求职信
2013/11/12 职场文书
社会学专业学生职业规划书
2014/02/07 职场文书
廉洁家庭事迹材料
2014/05/15 职场文书
生日庆典策划方案
2014/06/02 职场文书
仲裁协议书
2014/09/26 职场文书
2014银行授权委托书样本
2014/10/04 职场文书
个人委托书范文
2015/01/28 职场文书
2019年个人工作总结范文(3篇)
2019/08/27 职场文书
Python如何把不同类型数据的json序列化
2021/04/30 Python
Python编写可视化界面的全过程(Python+PyCharm+PyQt)
2021/05/17 Python