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 相关文章推荐
网页图片延时加载的js代码
Apr 22 Javascript
实用的Jquery选项卡TAB示例代码
Aug 28 Javascript
jQuery对于显示和隐藏等常用状态的判断方法
Dec 13 Javascript
javascript实现复选框超过限制即弹出警告框的方法
Feb 25 Javascript
jQuery实现跨域iframe接口方法调用
Mar 14 Javascript
深入探讨javascript函数式编程
Oct 11 Javascript
如何利用JS通过身份证号获取当事人的生日、年龄、性别
Jan 22 Javascript
浅谈bootstrap源码分析之tab(选项卡)
Jun 06 Javascript
vue-resourse将json数据输出实例
Mar 08 Javascript
在vue中获取token,并将token写进header的方法
Sep 26 Javascript
VueQuillEditor富文本上传图片(非base64)
Jun 03 Javascript
vue@cli3项目模板怎么使用public目录下的静态文件
Jul 07 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
php一个解析字符串排列数组的方法
2015/05/12 PHP
PHP正则表达式处理函数(PCRE 函数)实例小结
2019/05/09 PHP
Javascript控制页面链接在新窗口打开具体方法
2013/08/16 Javascript
JavaScript学习笔记之数组求和方法
2016/03/23 Javascript
jQuery插件pagination实现无刷新分页
2016/05/21 Javascript
Javascript实现通过选择周数显示开始日和结束日的实现代码
2016/05/30 Javascript
vue从使用到源码实现教程详解
2016/09/19 Javascript
AngularJS入门教程之数据绑定用法示例
2016/11/01 Javascript
JavaScript事件对象event用法分析
2018/07/27 Javascript
Vue.js实现可排序的表格组件功能示例
2019/02/19 Javascript
学习node.js 断言的使用详解
2019/03/18 Javascript
JS Math对象与Math方法实例小结
2019/07/05 Javascript
node.js使用net模块创建服务器和客户端示例【基于TCP协议】
2020/02/14 Javascript
Vue 组件复用多次自定义参数操作
2020/07/27 Javascript
[01:44]剑指西雅图 展望TI之CIS战队专访
2014/06/25 DOTA
[45:52]2018DOTA2亚洲邀请赛 4.1小组赛 A组加赛 LGD vs Liquid
2018/04/02 DOTA
PyTorch线性回归和逻辑回归实战示例
2018/05/22 Python
python散点图实例之随机漫步
2018/08/27 Python
用Pycharm实现鼠标滚轮控制字体大小的方法
2019/01/15 Python
python IDLE 背景以及字体大小的修改方法
2019/07/12 Python
python中几种自动微分库解析
2019/08/29 Python
Python安装whl文件过程图解
2020/02/18 Python
Selenium向iframe富文本框输入内容过程图解
2020/04/10 Python
python rolling regression. 使用 Python 实现滚动回归操作
2020/06/08 Python
查看keras的默认backend实现方式
2020/06/19 Python
pandas处理csv文件的方法步骤
2020/10/16 Python
法国床上用品商店:La Compagnie du lit
2019/12/26 全球购物
精彩的英文自荐信
2014/01/30 职场文书
优秀共产党员先进事迹材料
2014/05/06 职场文书
办公室主任竞聘演讲稿
2014/05/15 职场文书
电力工程合作意向书
2015/05/11 职场文书
企业员工辞职信范文
2015/05/12 职场文书
盗窃罪辩护词范文
2015/05/21 职场文书
小学教育见习总结
2015/06/23 职场文书
2019生态环境保护倡议书!
2019/07/03 职场文书
NodeJs使用webpack打包项目的方法详解
2022/02/28 NodeJs