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.勾选或取消
function check(id,check){
if(check){
jquery的attr属性$("."+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);

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。