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 相关文章推荐
可拖动窗口,附带鼠标控制渐变透明,开启关闭功能
Jun 26 Javascript
JavaScript 提升运行速度之循环篇 译文
Aug 15 Javascript
用JSON做数据传输格式中的一些问题总结
Dec 21 Javascript
chrome浏览器不支持onmouseleave事件的解决技巧
May 31 Javascript
Iframe 自动适应页面的高度示例代码
Feb 26 Javascript
JS使用ajax方法获取指定url的head信息中指定字段值的方法
Mar 24 Javascript
JS将滑动门改为选项卡(需鼠标点击)的实现方法
Sep 27 Javascript
jQuery插件实现无缝滚动特效
Nov 24 Javascript
JS简单实现浮动窗口效果示例
Sep 07 Javascript
ES6正则的扩展实例详解
Apr 25 Javascript
web3.js增加eth.getRawTransactionByHash(txhash)方法步骤
Mar 15 Javascript
针对Vue路由history模式下Nginx后台配置操作
Oct 22 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
WAR3重制版DOTA 5V5初体验
2020/04/09 DOTA
谈一谈收音机的高放电路
2021/03/02 无线电
Session的工作方式
2006/10/09 PHP
Laravel路由设定和子路由设定实例分析
2016/03/30 PHP
PHP实现多图上传(结合uploadify插件)思路分析
2016/11/30 PHP
PHP实现链表的定义与反转功能示例
2018/06/09 PHP
pjblog中的UBBCode.js
2007/04/25 Javascript
学习并汇集javascript匿名函数
2010/11/25 Javascript
无刷新预览所选择的图片示例代码
2014/04/02 Javascript
javascript数组操作总结和属性、方法介绍
2014/04/05 Javascript
iframe的onreadystatechange事件在firefox下的使用
2014/04/16 Javascript
使用jquery写个更改表格行顺序的小功能
2014/04/29 Javascript
jQuery中replaceAll()方法用法实例
2015/01/16 Javascript
js带点自动图片轮播幻灯片特效代码分享
2015/09/07 Javascript
jQuery插件EasyUI校验规则 validatebox验证框
2015/11/29 Javascript
JS将unicode码转中文方法
2017/05/08 Javascript
详解Angular 4.x NgIf 的用法
2017/05/22 Javascript
用最简单的方法判断JavaScript中this的指向(推荐)
2017/09/04 Javascript
总结js中的一些兼容性易错的问题
2017/12/18 Javascript
vue2.0之多页面的开发的示例
2018/01/30 Javascript
AngularJS动态生成select下拉框的方法实例
2019/11/17 Javascript
Vue项目前后端联调(使用proxyTable实现跨域方式)
2020/07/18 Javascript
JSONObject与JSONArray使用方法解析
2020/09/28 Javascript
Python多线程编程(八):使用Event实现线程间通信
2015/04/05 Python
简单介绍Python中的JSON模块
2015/04/08 Python
在Python中通过getattr获取对象引用的方法
2019/01/21 Python
python实现一行输入多个值和一行输出多个值的例子
2019/07/16 Python
详解KMP算法以及python如何实现
2020/09/18 Python
Python接口自动化测试框架运行原理及流程
2020/11/30 Python
优衣库英国官网:UNIQLO英国
2016/12/25 全球购物
科级干部考察材料
2014/02/15 职场文书
企业道德讲堂实施方案
2014/03/19 职场文书
面试通知短信
2015/04/20 职场文书
代理词怎么写
2015/05/25 职场文书
帮你提高开发效率的JavaScript20个技巧
2021/06/18 Javascript
浅谈Python实现opencv之图片色素的数值运算和逻辑运算
2021/06/23 Python