jQuery操作复选框(CheckBox)的取值赋值实现代码


Posted in Javascript onJanuary 10, 2017

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

以上所述是小编给大家介绍的jQuery操作复选框(CheckBox)的取值赋值实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
分享14个很酷的jQuery导航菜单插件
Apr 25 Javascript
JS原型对象通俗"唱法"
Dec 27 Javascript
向左滚动文字 js代码效果
Aug 17 Javascript
jQuery焦点图轮播特效代码分享(3款)
Sep 05 Javascript
AngularJS基础 ng-selected 指令简单示例
Aug 03 Javascript
vue-cli的webpack模板项目配置文件分析
Apr 01 Javascript
vue 子组件向父组件传值方法
Feb 26 Javascript
菊花转动的jquery加载动画效果
Aug 19 jQuery
jQuery实现左右两个列表框的内容相互移动功能示例
Jan 27 jQuery
Javascript实现一朵从含苞到绽放的玫瑰
Mar 30 Javascript
JS常用排序方法实例代码解析
Mar 03 Javascript
JS数据类型分类及常用判断方法
Nov 19 Javascript
jQuery UI仿淘宝搜索下拉列表功能
Jan 10 #Javascript
jquery 正整数数字校验正则表达式
Jan 10 #Javascript
Angular的$http的ajax的请求操作(推荐)
Jan 10 #Javascript
JS遍历对象属性的方法示例
Jan 10 #Javascript
浅谈Angular.js中使用$watch监听模型变化
Jan 10 #Javascript
利用Query+bootstrap和js两种方式实现日期选择器
Jan 10 #Javascript
js实现背景图自适应窗口大小
Jan 10 #Javascript
You might like
模拟xcopy的函数
2006/10/09 PHP
php中计算时间差的几种方法
2009/12/31 PHP
Yii框架实现对数据库的CURD操作示例
2019/09/03 PHP
html中使用javascript调用本地程序(exe、doc等)实现代码
2013/04/26 Javascript
jQuery插件的写法分享
2013/06/12 Javascript
JQuery跳出each循环的方法
2015/04/16 Javascript
JS实现CheckBox复选框全选全不选功能
2015/05/06 Javascript
jquery实现简单的表单验证
2015/11/17 Javascript
js控制TR的显示隐藏
2016/03/04 Javascript
在JavaScript中对HTML进行反转义详解
2016/05/18 Javascript
基于WebUploader的文件上传js插件
2016/08/19 Javascript
使用JQuery选择HTML遍历函数的方法
2016/09/17 Javascript
JavaScript实现同一个页面打开多张图片
2016/12/29 Javascript
ionic中的$ionicPlatform.ready事件中的通用设置
2017/06/11 Javascript
基于webpack-hot-middleware热加载相关错误的解决方法
2018/02/22 Javascript
关于自定义Egg.js的请求级别日志详解
2018/12/12 Javascript
微信小程序实现弹出菜单动画
2019/06/21 Javascript
nodejs实现聊天机器人功能
2019/09/19 NodeJs
javascript设计模式之迭代器模式
2020/01/30 Javascript
原生js实现随机点名
2020/07/05 Javascript
python用于url解码和中文解析的小脚本(python url decoder)
2013/08/11 Python
Python图像处理之识别图像中的文字(实例讲解)
2018/05/10 Python
pycharm 将django中多个app放到同个文件夹apps的处理方法
2018/05/30 Python
python numpy 部分排序 寻找最大的前几个数的方法
2018/06/27 Python
Python常见内置高效率函数用法示例
2018/07/31 Python
Python新手学习标准库模块命名
2020/05/29 Python
Python OpenCV中的numpy与图像类型转换操作
2020/12/11 Python
10 套华丽的CSS3 按钮小结
2012/10/03 HTML / CSS
什么是Oracle的后台进程background processes?都有哪些后台进程?
2012/04/26 面试题
讲文明树新风公益广告宣传方案
2014/02/25 职场文书
小学班级口号
2014/06/09 职场文书
2015圣诞节贺卡寄语
2015/03/24 职场文书
销售经理助理岗位职责
2015/04/13 职场文书
2015年国庆放假通知范文
2015/08/18 职场文书
女性励志书籍推荐
2019/08/19 职场文书
浅析CSS在DevTools 中架构演变
2021/10/05 HTML / CSS