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代码
May 11 Javascript
js实现的切换面板实例代码
Jun 17 Javascript
javascript自动给文本url地址增加链接的方法分享
Jan 20 Javascript
JS兼容浏览器的导出Excel(CSV)文件的方法
May 03 Javascript
JavaScript实现强制重定向至HTTPS页面
Jun 10 Javascript
javascript带回调函数的异步脚本载入方法实例分析
Jul 02 Javascript
jQuery居中元素scrollleft计算方法示例
Jan 16 Javascript
详解通过源码解析Node.js中cluster模块的主要功能实现
May 16 Javascript
vuejs点击class变化的实例
Sep 05 Javascript
详解Vue源码中一些util函数
Apr 24 Javascript
JavaScript数组及常见操作方法小结
Nov 13 Javascript
jQuery实现本地存储
Dec 22 jQuery
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
ThinkPHP使用心得分享-上传类UploadFile的使用
2014/05/15 PHP
php实现最简单的MVC框架实例教程
2014/09/08 PHP
教你识别简单的免查杀PHP后门
2015/09/13 PHP
PHP数组式访问接口ArrayAccess用法分析
2017/12/28 PHP
Ajax+PHP实现的删除数据功能示例
2019/02/12 PHP
详解PHP素材图片上传、下载功能
2019/04/12 PHP
php过滤htmlspecialchars() 函数实现把预定义的字符转换为 HTML 实体用法分析
2019/06/25 PHP
PHP设计模式之 策略模式Strategy详解【对象行为型】
2020/05/01 PHP
javascript 处理事件绑定的一些兼容写法
2009/12/24 Javascript
关于flash遮盖div浮动层的解决方法
2010/07/17 Javascript
JQuery为页面Dom元素绑定事件及解除绑定方法
2014/04/23 Javascript
JS中mouseover和mouseout多次触发问题如何解决
2016/06/06 Javascript
JS实现动画兼容性的transition和transform实例分析
2016/12/13 Javascript
从零开始搭建一个react项目开发
2018/02/09 Javascript
初步解析Python中的yield函数的用法
2015/04/03 Python
详解Django框架中的视图级缓存
2015/07/23 Python
Python中规范定义命名空间的一些建议
2016/06/04 Python
python中的随机函数random的用法示例
2018/01/27 Python
详解程序意外中断自动重启shell脚本(以Python为例)
2019/07/26 Python
使用Windows批处理和WMI设置Python的环境变量方法
2019/08/14 Python
python读取tif图片时保留其16bit的编码格式实例
2020/01/13 Python
英国Flybe航空官网:欧洲最大的独立支线廉价航空公司
2019/07/15 全球购物
荷兰睡眠专家:Beter Bed
2020/11/23 全球购物
教师产假请假条
2014/04/10 职场文书
专项法律服务方案
2014/06/11 职场文书
试用期解除劳动合同通知书
2015/04/16 职场文书
2015年妇产科工作总结
2015/05/18 职场文书
2019年幼儿园家长接送责任书
2019/10/29 职场文书
如何用JS实现网页瀑布流布局
2021/04/24 Javascript
html+css实现赛博朋克风格按钮
2021/05/26 HTML / CSS
在 HTML 页面中使用 React的场景分析
2022/01/18 Javascript
5人制售《绝地求生》游戏外挂获利500多万元 被判刑
2022/03/31 其他游戏
升级 Win11 还是坚守 Win10?微软 Win11 新系统缺失功能大盘点
2022/04/05 数码科技
从结婚开始的恋爱故事。小说《我的美好婚事》TV动画化决定
2022/04/07 日漫
Nginx开源可视化配置工具NginxConfig使用教程
2022/06/21 Servers
CSS浮动引起的高度塌陷问题
2022/08/05 HTML / CSS