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中定义方法的另类写法(批量定义js对象的方法)
Feb 25 Javascript
jquery实现鼠标拖动图片效果示例代码
Jan 09 Javascript
使用AOP改善javascript代码
May 01 Javascript
JavaScript中split与join函数的进阶使用技巧
May 03 Javascript
jQuery Easyui学习教程之实现datagrid在没有数据时显示相关提示内容
Jul 09 Javascript
javascript使用 concat 方法对数组进行合并的方法
Sep 08 Javascript
Bootstrap表格使用方法详解
Feb 17 Javascript
详解webpack+es6+angular1.x项目构建
May 02 Javascript
在vue中获取dom元素内容的方法
Jul 10 Javascript
微信小程序获取手机网络状态的方法【附源码下载】
Dec 08 Javascript
浅谈Angular单元测试总结
Mar 22 Javascript
Vue父子之间值传递的实例教程
Jul 02 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
zend framework多模块多布局配置
2011/02/26 PHP
php构造方法中析构方法在继承中的表现
2016/04/12 PHP
POST一个JSON格式的数据给Restful服务实例详解
2017/04/07 PHP
laravel框架 laravel-admin上传图片到oss的方法
2019/10/13 PHP
php 下 html5 XHR2 + FormData + File API 上传文件操作实例分析
2020/02/28 PHP
javascript的事件描述
2006/09/08 Javascript
jquery插件 cluetip 关键词注释
2010/01/12 Javascript
JQuery为textarea添加maxlength属性的代码
2010/04/07 Javascript
使用UglifyJS合并/压缩JavaScript的方法
2012/03/07 Javascript
THREE.JS入门教程(3)着色器-下
2013/01/24 Javascript
JS操作Cookies的小例子
2013/10/15 Javascript
JavaScript设计模式之代理模式介绍
2014/12/28 Javascript
js简单工厂模式用法实例
2015/06/30 Javascript
JavaScript 2048 游戏实例代码(简单易懂)
2016/03/25 Javascript
JQuery 传送中文乱码问题的简单解决办法
2016/05/24 Javascript
bootstrap suggest下拉框使用详解
2017/04/10 Javascript
微信小程序 生命周期函数详解
2017/05/24 Javascript
JS FormData上传文件的设置方法
2017/07/05 Javascript
bootstrap Table服务端处理分页(后台是.net)
2017/10/19 Javascript
Python语言的12个基础知识点小结
2014/07/10 Python
python+opencv+caffe+摄像头做目标检测的实例代码
2018/08/03 Python
Python魔法方法详解
2019/02/13 Python
Gauss-Seidel迭代算法的Python实现详解
2019/06/29 Python
Python中有几个关键字
2020/06/04 Python
美国单身专业人士在线约会网站:EliteSingles
2019/03/19 全球购物
员工自我鉴定范文
2013/10/06 职场文书
金属材料工程毕业生个人的自我评价
2013/11/28 职场文书
英语自荐信常用语句
2013/12/13 职场文书
项目管理计划书
2014/01/09 职场文书
教师专业自荐书范文
2014/02/10 职场文书
公司营业员的自我评价
2014/03/04 职场文书
个人委托书格式
2014/04/04 职场文书
学习雷锋活动总结
2014/04/29 职场文书
2015年个人剖析材料范文
2014/12/29 职场文书
2015年植树节活动总结
2015/02/06 职场文书
如何利用React实现图片识别App
2022/02/18 Javascript