checkbox中checked属性总结

简介: checkbox中checked属性总结

一、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月前
layui给radio添加checked属性不起作用
layui给radio添加checked属性不起作用
113 0
|
JavaScript
Element el-radio 单选框详解
本文目录 1. 用途 2. 单选框 3. 单选框样式 4. 单选框组 4. 单选框组样式 5. 尺寸调节 6. 绑定值变化事件 7. 小结
1618 0
Element el-radio 单选框详解
|
1月前
|
Web App开发 数据可视化 JavaScript
input标签的type属性汇总
input标签的type属性汇总
89 0
|
5月前
input的Checkbox(复选框)属性具体怎么使用
input的Checkbox(复选框)属性具体怎么使用
289 0
43zTree - checkbox / radio 共存
43zTree - checkbox / radio 共存
46 0
|
JavaScript 前端开发
Vue——04-02v-model的使用原理、结合radio、checkbox、checkbox(多选)、checked(值的绑定)、select以及修饰符的使用
v-model的使用原理、结合radio、checkbox、checkbox(多选)、checked(值的绑定)、select以及修饰符的使用
179 0
input checkbox 复选框大小修改
有的时候,需要使用复选框,但是复选框有时候默认的太小,这时候就需要加大复选框。 解决方法: 其实就是zoom属性,这个是放大的意思,可以设置为180%,这样就会比之前大很多。
1467 0
自定义Checkbox和Radiobox
在线演示 本地下载
889 0
input[type="radio"]自定义样式
input为radio时,虽然会有默认选中的样式,但是并不符合大多数项目的需求,我们的目标是可以随心所欲自定义它的样式。怎么做呢?其实很简单,只要抓住3点。分别是1.label 2.隐藏自带样式 3.绘制我们的样式。
1198 0
|
JavaScript 前端开发 Windows