jQuery操作复选框(CheckBox)的取值赋值实现代码


Posted in Javascript onJanuary 10, 2017

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()); 
  } 
});

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); 
});

以上所述是小编给大家介绍的jQuery操作复选框(CheckBox)的取值赋值实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
简单时间提示DEMO从0开始一直进行计时
Nov 19 Javascript
JavaScript实现简单的二级导航菜单实例
Apr 15 Javascript
JavaScript取得WEB安全颜色列表的方法
Jul 14 Javascript
JavaScript中自带的 reduce()方法使用示例详解
Aug 10 Javascript
bootstrap手风琴制作方法详解
Jan 11 Javascript
js+css3实现旋转效果
Jan 20 Javascript
jQuery上传插件webupload使用方法
Aug 01 jQuery
babel的使用及安装配置教程
Feb 22 Javascript
vue结合axios与后端进行ajax交互的方法
Jul 06 Javascript
Vue的Eslint配置文件eslintrc.js说明与规则介绍
Feb 03 Javascript
jQuery 图片查看器插件 Viewer.js用法简单示例
Apr 04 jQuery
15个值得收藏的JavaScript函数
Sep 15 Javascript
jQuery UI仿淘宝搜索下拉列表功能
Jan 10 #Javascript
jquery 正整数数字校验正则表达式
Jan 10 #Javascript
Angular的$http的ajax的请求操作(推荐)
Jan 10 #Javascript
JS遍历对象属性的方法示例
Jan 10 #Javascript
浅谈Angular.js中使用$watch监听模型变化
Jan 10 #Javascript
利用Query+bootstrap和js两种方式实现日期选择器
Jan 10 #Javascript
js实现背景图自适应窗口大小
Jan 10 #Javascript
You might like
PHP5.2下chunk_split()函数整数溢出漏洞 分析
2007/06/06 PHP
PHP 工厂模式使用方法
2010/05/18 PHP
一些php技巧与注意事项分析
2011/02/03 PHP
PHP学习之字符串比较和查找
2011/04/17 PHP
curl和libcurl的区别简介
2015/07/01 PHP
PHP中配置IIS7实现基本身份验证的方法
2015/09/24 PHP
ThinkPHP设置禁止百度等搜索引擎转码(简单实用)
2016/02/15 PHP
JQuery 初体验(建议学习jquery)
2009/04/25 Javascript
Javascript中的window.event.keyCode使用介绍
2011/04/26 Javascript
JS无限极树形菜单,json格式、数组格式通用示例
2013/07/30 Javascript
浅析hasOwnProperty方法的应用
2013/11/20 Javascript
node.js中的http.response.end方法使用说明
2014/12/14 Javascript
jQuery中:contains选择器用法实例
2014/12/30 Javascript
JS+CSS实现六级网站导航主菜单效果
2015/09/28 Javascript
js实现滚动条滚动到页面底部继续加载
2015/12/19 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
2016/01/04 Javascript
简单实现js选项卡切换效果
2016/02/03 Javascript
AngularJS中的包含详细介绍及实现示例
2016/07/28 Javascript
jQuery Validate格式验证功能实例代码(包括重名验证)
2017/07/18 jQuery
ReactNative页面跳转Navigator实现的示例代码
2017/08/02 Javascript
Vue 中可以定义组件模版的几种方式
2019/08/06 Javascript
scrapy自定义pipeline类实现将采集数据保存到mongodb的方法
2015/04/16 Python
Python实现生成随机日期字符串的方法示例
2017/12/25 Python
Python实现PS滤镜功能之波浪特效示例
2018/01/26 Python
利用Python代码实现数据可视化的5种方法详解
2018/03/25 Python
如何解决django-celery启动后迅速关闭
2019/10/16 Python
python tkinter控件布局项目实例
2019/11/04 Python
Python flask路由间传递变量实例详解
2020/06/03 Python
python:HDF和CSV存储优劣对比分析
2020/06/08 Python
python代码区分大小写吗
2020/06/17 Python
python SOCKET编程基础入门
2021/02/27 Python
机械设计制造专业个人求职信
2013/09/25 职场文书
学术会议领导致辞
2015/07/29 职场文书
2016秋季运动会开幕词
2016/03/04 职场文书
Redis 的查询很快的原因解析及Redis 如何保证查询的高效
2022/03/16 Redis
MySQL下载安装配置详细教程 附下载资源
2022/09/23 MySQL