一、checked属性定义和用法

1.checked属性是一个布尔属性

2.checked属性规定在页面加载时应该被预先选定的<input>元素

3.checked属性适用于<input type="checkbox">和<input type="radio">

4.checked属性也可以在页面加在后,通过JavaScript代码进行设置

attr()/prop()方法设置或返回被选元素的属性和值,当该方法用于返回属性值时,则返回第一个匹配元素的值,当该方法用于设置属性值时,则为匹配元素集合设置一个或多个属性/值对。例如:$("#input").attr({width:"160",height:"180"});

二、checked属性的用法

操作checked、disabled、selected属性,建议只用prop()方法,不要使用attr()方法。

1.Jquery判断checked是否选中状态的三种方法:

1>.attr("checked")  //返回:"checked" 或 "undefined"

2>.prop("checked") //返回  true/false

3>.is(":checked")  //返回 true/false

2.Jquery使用attr属性赋值checked

1> $("input[type='checked']").attr("checked","checked");   //通用

2> $("input[type='checked']").attr("checked",false);  //不标准

3> $("input[type='checked']").attr("checked","false"); //不标准

3.Jquery使用prop属性赋值checked

1> $("input[type='checked']").prop("checked",true); //标准写法

2> $("input[type='checked']").prop({cheked:true}); //map键值对

3> $("input[type='checked']").prop("checked",funtion(){ return true; }); //函数返回true或false

4> $("input[type='checked']").prop("checked","checked");  //不标准

4.获取单个checkbox选中项的值

1>$("#chx1").find("input:checkbox:checked").val()

2>$("#chx1").find("input[type='checkbox']:checked").val()

3>$("#chx1").find("input:[type='checkbox']:checked").val()

4>$("#chx1").find("input[name='ck']:checked").val()

5>$("#chx1").find("input:[name='ck']:checked").val()

5.勾选或取消

function check(id,check){if(check){$("."+id).find("input:[type='checkbox']").prop("checked",true);}else{$("."+id).find("input[type='checkbox']").prop("checked",false);}
}

6.获取多个checkbox选中项

$("#chk1").find("input:checkbox").each(function(){if($(this).prop('checked')==true){console.log($(this).val());}});

7.设置第一个checkbox为选中值

$("#chk1").find("input:checkbox:first").prop("checked",true);

$("#chk1").find("input:checkbox").eq(0).prop("checked",true);

8.设置最后一个checkbox为选中值

$("#chk1").find("input:checkbox:last").prop("checked",true);

9.选中所有奇数或偶数项

$("#chk1").find("input:[type='checkbox']:even").prop("checked",true);

$("#chk1").find("input[type='checkbox']:odd").prop("checked",true);

10.根据索引值设置任意一个checkbox为选中值

$("#chk1").find('input:checkbox').eq(索引值).prop("checked",true);

$("#chk1").find("input:checkbox").slice(1,2).prop("checked",true);//同时选中第0个和第1个checkbox

11.根据value值设置checkbox为选中值

$("#chk1").find("input:checkbox[value='1']").prop('checked',true);

$("#chk1").find("input:[type='checked'][value='1']").prop('checked',true);

checkbox中checked属性总结相关推荐

  1. jquery与checkbox的checked属性的问题

    jquery与checkbox的checked属性的问题,讲的是控件<input type="checkbox"></input> 1.页面加载成功后,点击 ...

  2. jQuery中checkbox的checked属性

    <input type="checkbox" id="target"> $("#target").attr("chec ...

  3. jquery 设置checkbox的checked属性 总是出问题

    所使用的jquery版本为jquery-1.9.1,浏览器为Chrome  1.通过prop方法获取checked属性,获取的checked返回值为boolean,选中为true,否则为flase  ...

  4. jq设置checked是否选中_javascript之jquery如何判断input type=checkbox中checked是否存在选中项呢?...

    摘要: 下文讲述jquery技巧-获取checkbox对象是否选中的方法分享,如下所示: 实现思路: 方式1: jquery 1.6版本之前-我们检测checkbox是否被选中,可使用attr方法 $ ...

  5. jquery-1.10.2 获取checkbox的checked属性总是undefined

    项目中用的jquery-1.10.2 需要检测一个checkbox的选中状态,想当然的用 .attr("checked") ,结果发现,无论是否选中,这个值都是 undefined ...

  6. jquery 获取checkbox的checked属性总是undefined

    项目中用的jquery1.9 今天需要检测一个checkbox的选中状态,想当然的用 .attr("checked") ,结果发现,无论是否选中,这个值都是 undefined 未 ...

  7. jquery设置checkbox为checked状态不改变的解决办法

    使用jQuery设置checkbox为选择状态时,我们通常会使用 $(this).attr("checked", true); //或者 $(this).attr("ch ...

  8. 复选框html语言,复选框的checked属性

    javascript如何控制input的checked属性 由于我不懂JS语言,只能尽量描述,问题应该比较菜,还望看到的朋友能够 var radiovar = document.getElements ...

  9. android中怎么保存checkbox中的checked属性_Vue 精粹:v-model指令在组件中怎么玩

    最近在写组件的时候,遇到了 v-model 的使用问题,在 Vue 官方文档中,有两小端内容是关于 v-model 指令在组件中的使用,查阅文档后,依然不得要领,最后几番折腾,理论结合实践,终于领悟其 ...

最新文章

  1. 字符串位加密 php,PHP字符串加密增强版
  2. C# 获取当前屏幕DPI
  3. 西电计算机组装实验报告,西电模电实验报告(共7篇).docx
  4. 单元测试系列之八:Sonar 数据库表关系整理一(续)
  5. $(ajax) jquery+ajax 交互
  6. 评《认知红利》 谢春霖著
  7. php 追溯,php 无限分类父子追溯方法
  8. 电气工程师学python_Python 在电气工程及其自动化上有哪些应用?
  9. 【转】spin_lock、spin_lock_irq、spin_lock_irqsave区别
  10. python控制程控电源_程控电源原理_程控电源的用途浅谈
  11. jekenis父子结构项目打包_全栈之DevOps系列 - 发布 Python 项目 开源/私有 包
  12. 程序员“放弃” Python!?发生了啥?
  13. 《Servlet和JSP学习指南》一第1章 Servlet 1.1 Servlet API概述
  14. jquery库实现iframe自适应内容高度和宽度
  15. c语言用数组实现大数加减,c语言版大数计算器(实现大数的加减乘除运算,已更新源代码)...
  16. vue+elementUI+node实现登录模块--验证用户名是否正确
  17. 全国海选第四期:北京和海外赛区(视频)
  18. 如何应用好计算机教学设计,计算机教学设计
  19. poj 2152 树形dp(建立消防站)
  20. 华为3108raid安linux,华为RH2288HV3部署RAID(阵列卡LSISAS3108)

热门文章

  1. 推荐系统_经典推荐方法
  2. UVM:7.5.1 期望值与镜像值
  3. 暴力破解登录密码(登录批量发包)
  4. lol自动刷人机辅助_LOL排位赛掉分脚本横行?给ADC打辅助的奶妈有可能是人机
  5. 基于java 工单管理_java毕业设计_springboot框架的工单管理
  6. 第一课:暴力破解与实用性优先
  7. 高级软件测试工程师的面试
  8. 动网论坛密码暴力破解程序代码
  9. Bilibili漫画抓取思路
  10. tailwindcss模板_如何开始使用TailwindCSS