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 相关文章推荐
js控制当再次点击按钮时的间隔时间
Jun 03 Javascript
jQuery通过控制节点实现仅在前台通过get方法完成参数传递
Feb 02 Javascript
jQuery实现仿QQ头像闪烁效果的文字闪动提示代码
Nov 03 Javascript
Bootstrap轮播插件中图片变形的终极解决方案 使用jqthumb.js
Jul 10 Javascript
Bootstrap Modal对话框如何在关闭时触发事件
Dec 02 Javascript
Bootstrap的popover(弹出框)2秒后定时消失的实现代码
Feb 27 Javascript
Bootstrap滚动监听组件scrollspy.js使用方法详解
Jul 20 Javascript
webpack实现热加载自动刷新的方法
Jul 30 Javascript
认识less和webstrom的less配置方法
Aug 02 Javascript
JS数组splice操作实例分析
Oct 12 Javascript
vue 指令和过滤器的基本使用(品牌管理案例)
Nov 04 Javascript
JavaScript的function函数详细介绍
Nov 20 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 文章调用类代码
2011/08/11 PHP
PHP使用内置函数生成图片的方法详解
2016/05/09 PHP
YII视图整合kindeditor扩展的方法
2016/07/13 PHP
extjs 为某个事件设置拦截器
2010/01/15 Javascript
javascript 学习笔记(onchange等)
2010/11/14 Javascript
js关闭浏览器窗口及检查浏览器关闭事件
2013/09/03 Javascript
手机平板等移动端适配跳转URL的js代码
2014/01/25 Javascript
JS表的模拟方法
2015/02/05 Javascript
60行js代码实现俄罗斯方块
2015/03/31 Javascript
jQuery实现的调整表格行tr上下顺序
2016/01/10 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(一)
2017/01/21 Javascript
NodeJS使用七牛云存储上传文件的方法
2017/07/24 NodeJs
详解Vue项目在其他电脑npm run dev运行报错的解决方法
2018/10/29 Javascript
Node.js控制台彩色输出的方法与原理实例详解
2019/12/01 Javascript
如何在JavaScript中正确处理变量
2020/12/25 Javascript
Python实现Const详解
2015/01/27 Python
python中类变量与成员变量的使用注意点总结
2017/04/29 Python
pybind11在Windows下的使用教程
2019/07/04 Python
Pytorch反向求导更新网络参数的方法
2019/08/17 Python
python 进程间数据共享multiProcess.Manger实现解析
2019/09/23 Python
树莓派极简安装OpenCv的方法步骤
2019/10/10 Python
Python迭代器iterator生成器generator使用解析
2019/10/24 Python
django formset实现数据表的批量操作的示例代码
2019/12/06 Python
Python基于requests库爬取网站信息
2020/03/02 Python
详解python程序中的多任务
2020/09/16 Python
python 绘制场景热力图的示例
2020/09/23 Python
html5仿支付宝密码框的实现代码
2017/09/06 HTML / CSS
美国知名奢侈美容品牌零售商:Cos Bar
2017/04/21 全球购物
美国医疗用品、医疗设备和家庭保健用品商店:Medical Supply Depot
2018/07/08 全球购物
中职应届生会计求职信
2013/10/23 职场文书
业务代表的岗位职责
2013/11/16 职场文书
幼儿园教师考核制度
2014/02/01 职场文书
祖国在我心中演讲稿600字
2014/05/04 职场文书
励志演讲稿800字
2014/08/21 职场文书
师德师风事迹材料
2014/12/20 职场文书
Mysql InnoDB 的内存逻辑架构
2022/05/06 MySQL