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 split 的用法和定义 js split分割字符串成数组的实例代码
May 13 Javascript
js 获取屏幕各种宽高的方法(浏览器兼容)
May 15 Javascript
js函数模拟显示桌面.scf程序示例
Apr 20 Javascript
javascript弹出页面回传值的方法
Jan 28 Javascript
JS正则表达式修饰符global(/g)用法分析
Dec 27 Javascript
AngularJS入门教程一:路由用法初探
May 27 Javascript
Javascript中从学习bind到实现bind的过程
Jan 05 Javascript
基于vue-simplemde实现图片拖拽、粘贴功能
Apr 12 Javascript
jQuery实现模糊搜索功能的方法分析
Jun 29 jQuery
基于Vue-Cli 打包自动生成/抽离相关配置文件的实现方法
Dec 09 Javascript
js简单遍历获取对象中的属性值的方法示例
Jun 19 Javascript
微信小程序实现页面浮动导航
Jan 08 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将数据库中所有内容生成静态html文档的代码
2010/04/12 PHP
php获取系统变量方法小结
2015/05/29 PHP
js png图片(有含有透明)在IE6中为什么不透明了
2010/02/07 Javascript
遨游,飞飞,IE,空中网 浏览器无提示关闭方法
2011/07/11 Javascript
showModalDialog模态对话框的使用详解以及浏览器兼容
2014/01/11 Javascript
javascript实现动态侧边栏代码
2014/02/19 Javascript
深入浅析JavaScript中prototype和proto的关系
2015/11/15 Javascript
javascript实现简单计算器效果【推荐】
2016/04/19 Javascript
浏览器兼容的JS写法总结
2016/04/27 Javascript
jQuery实现鼠标滚动图片延迟加载效果附源码下载
2016/06/28 Javascript
全面接触神奇的Bootstrap导航条实战篇
2016/08/01 Javascript
深入浅析JS是按值传递还是按引用传递(推荐)
2016/09/18 Javascript
javascript使用闭包模拟对象的私有属性和方法
2016/10/05 Javascript
Angular表单验证实例详解
2016/10/20 Javascript
jQuery操作css样式
2017/05/15 jQuery
react-router实现跳转传值的方法示例
2017/05/27 Javascript
使用D3.js制作图表详解
2017/08/13 Javascript
Vue多系统切换实现方案
2018/06/05 Javascript
关于vue路由缓存清除在main.js中的设置
2019/11/06 Javascript
Vue插件之滑动验证码用法详解
2020/04/05 Javascript
Python 数据结构之旋转链表
2017/02/25 Python
python实现点对点聊天程序
2018/07/28 Python
对python 读取线的shp文件实例详解
2018/12/22 Python
PyCharm使用Docker镜像搭建Python开发环境
2019/12/26 Python
python shell命令行中import多层目录下的模块操作
2020/03/09 Python
Python AutoCAD 系统设置的实现方法
2020/04/01 Python
可自定义箭头样式的CSS3气泡提示框
2016/03/16 HTML / CSS
HTML5 客户端数据库简易使用:IndexedDB
2019/12/19 HTML / CSS
美国经典刺绣和字母儿童服装特卖:Smocked Auctions
2018/07/16 全球购物
blueseventy官网:铁人三项和比赛泳衣
2021/02/06 全球购物
中兴通讯全球官方网站:ZTE
2020/12/26 全球购物
初中女生自我鉴定
2013/12/19 职场文书
结婚邀请函范文
2014/01/14 职场文书
临床医师个人自我评价
2014/04/06 职场文书
个人投资计划书
2014/05/01 职场文书
会计个人实习计划书
2014/08/15 职场文书