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 相关文章推荐
深入理解Javascript闭包 新手版
Dec 28 Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
Feb 10 Javascript
去掉gridPanel表头全选框的小例子
Jul 18 Javascript
js定时器(执行一次、重复执行)
Mar 07 Javascript
jquery uploadify 在FF下无效的解决办法
Sep 26 Javascript
JavaScript使用Replace进行字符串替换的方法
Apr 14 Javascript
Vue2.0基于vue-cli+webpack同级组件之间的通信教程(推荐)
Sep 14 Javascript
基于vue实现网站前台的权限管理(前后端分离实践)
Jan 13 Javascript
对vue事件的延迟执行实例讲解
Aug 28 Javascript
Vue中Table组件行内右键菜单实现方法(基于 vue + AntDesign)
Nov 21 Javascript
基于vue.js实现购物车
Jan 15 Javascript
浅谈vuex为什么不建议在action中修改state
Feb 02 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
人脸识别测颜值、测脸龄、测相似度微信接口
2016/04/07 PHP
如何利用PHP实现上传图片功能详解
2020/09/24 PHP
jquery 学习之二 属性 文本与值(text,val)
2010/11/25 Javascript
简单的前端js+ajax 购物车框架(入门篇)
2011/10/29 Javascript
将list转换为json失败的原因
2013/12/17 Javascript
js日期联动示例
2014/05/02 Javascript
javascript实现根据身份证号读取相关信息
2014/12/17 Javascript
JQuery中DOM加载与事件执行实例分析
2015/06/13 Javascript
Web 开发中Ajax的Session 超时处理方法
2017/01/19 Javascript
vue组件父子间通信详解(三)
2017/11/07 Javascript
微信小程序之swiper轮播图中的图片自适应高度的方法
2018/04/23 Javascript
NodeJs生成sitemap站点地图的方法示例
2019/06/11 NodeJs
layui自定义ajax左侧三级菜单
2019/07/26 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
2020/07/11 Javascript
Python随机生成一个6位的验证码代码分享
2015/03/24 Python
Python中的super用法详解
2015/05/28 Python
在django中使用自定义标签实现分页功能
2017/07/04 Python
Python列表生成式与生成器操作示例
2018/08/01 Python
python读取txt文件中特定位置字符的方法
2018/12/24 Python
python使用PIL实现多张图片垂直合并
2019/01/15 Python
解决Python Matplotlib绘图数据点位置错乱问题
2020/05/16 Python
Python3.9 beta2版本发布了,看看这7个新的PEP都是什么
2020/06/10 Python
python能在浏览器能运行吗
2020/06/17 Python
详解python中的闭包
2020/09/07 Python
生物制药毕业生自荐信
2013/10/16 职场文书
大学班长的职责
2014/01/27 职场文书
捐助倡议书范文
2014/04/15 职场文书
幼儿园大班评语大全
2014/04/17 职场文书
2014年三万活动总结
2014/04/26 职场文书
企业宣传策划方案
2014/05/29 职场文书
个人委托书范本
2014/09/13 职场文书
开展批评与自我批评发言稿
2014/10/16 职场文书
云南省召开党的群众路线教育实践活动总结会议新闻稿
2014/10/21 职场文书
欠条样本
2015/07/03 职场文书
图书馆义工感想
2015/08/07 职场文书
MySQL实现配置主从复制项目实践
2022/03/31 MySQL