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 相关文章推荐
由JavaScript中call()方法引发的对面向对象继承机制call的思考
Sep 12 Javascript
javascript数组详解
Oct 22 Javascript
Javascript实现div层渐隐效果的方法
May 30 Javascript
jQuery toggle 代替方法
Mar 22 Javascript
jquery属性,遍历,HTML操作方法详解
Sep 17 Javascript
Angular路由简单学习
Dec 26 Javascript
JS实现双击内容变为可编辑状态
Mar 03 Javascript
微信小程序实现图片轮播及文件上传
Apr 07 Javascript
JavaScript实现反转字符串的方法详解
Apr 27 Javascript
Vue动态组件实例解析
Aug 20 Javascript
微信小程序实现多选框全选与取消全选功能示例
May 14 Javascript
如何在微信小程序中存setStorage
Dec 13 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
玩家交还《星际争霸》原始码光盘 暴雪报以厚礼
2017/05/05 星际争霸
php 中文处理函数集合
2008/08/27 PHP
关于php 接口问题(php接口主要也就是运用curl,curl函数)
2013/07/01 PHP
Js sort排序使用方法
2011/10/17 Javascript
JQuery入门—JQuery程序的代码风格详细介绍
2013/01/03 Javascript
jquery.post用法关于type设置问题补充
2014/01/03 Javascript
手机端网页点击链接触发自动拨打或保存电话的示例代码
2014/08/15 Javascript
jQuery实现自动与手动切换的滚动新闻特效代码分享
2015/08/27 Javascript
Markdown与Bootstrap相结合实现图片自适应属性
2016/05/04 Javascript
jQueryUI 拖放排序遇到滚动条时有可能无法执行排序的小bug及解决方案
2016/12/19 Javascript
详解简单易懂的 ES6 Iterators 指南和示例
2019/09/24 Javascript
Vue+Node服务器查询Mongo数据库及页面数据传递操作实例分析
2019/12/20 Javascript
深入分析JavaScript 事件循环(Event Loop)
2020/06/19 Javascript
[59:08]Ti4 冒泡赛第二天 NEWBEE vs Titan 2
2014/07/15 DOTA
[02:32]DOTA2亚洲邀请赛 VG战队巡礼
2015/02/03 DOTA
Python抓取淘宝下拉框关键词的方法
2015/07/08 Python
Python读取Excel的方法实例分析
2015/07/11 Python
从零开始学Python第八周:详解网络编程基础(socket)
2016/12/14 Python
老生常谈python之鸭子类和多态
2017/06/13 Python
Python中最大最小赋值小技巧(分享)
2017/12/23 Python
Python实现二叉树的最小深度的两种方法
2019/09/30 Python
python 实现二维字典的键值合并等函数
2019/12/06 Python
django filter过滤器实现显示某个类型指定字段不同值方式
2020/07/16 Python
CSS3实现王者荣耀匹配人员加载页面的方法
2019/04/16 HTML / CSS
基于Html5实现的react拖拽排序组件示例
2018/08/13 HTML / CSS
html5响应式开发自动计算fontSize的方法
2020/01/13 HTML / CSS
俄罗斯天然和有机产品、健康生活网上商店:Fitomarket.ru
2020/10/09 全球购物
Delphi工程师笔试题
2013/09/21 面试题
蔬菜基地的创业计划书
2014/01/06 职场文书
捐款倡议书范文
2014/02/02 职场文书
材料物理专业求职信
2014/09/01 职场文书
2014年行风建设工作总结
2014/12/01 职场文书
2014幼儿园卫生保健工作总结
2014/12/05 职场文书
八年级物理教学反思
2016/02/19 职场文书
小米11和iphone12哪个值得买?小米11对比iphone12评测
2021/04/21 数码科技
HTML页面中使两个div并排显示的实现
2022/05/15 HTML / CSS