最近使用jQuery-2.2.0获取checkbox选中值为undefined,网上找了很多资料终于解决。
v1.6以后attr(‘checked’)就返回checked和undefined,v1.6以前返回true和false,v1.6以后可以使用is(‘:checked’)或者.prop(‘checked’)来返回true和false。
总结:
1.6以前 | 1.6以后 | |
获取checkbox值 | .attr('checked'): | .is(':checked') |
给checkbox赋值 | .attr("checked","checked"); .attr("checked",true); | .prop("checked",true); .prop("checked","checked"); .prop({checked:true}); .prop("checked",function(){ return true; }); |
demo:
<input type="checkbox" id="checkAll" />
<input name="openOrClose" type="checkbox"/>
<input name="openOrClose" type="checkbox"/>
<input name="openOrClose" type="checkbox"/>
<script type="text/javascript">
$(function() {
$("input[name='openOrClose']").click(function(){
if(getCheckedNum()>0){
$("#checkAll").prop("checked",true);
}else{
$("#checkAll").prop("checked",false);
}
});
$("#checkAll").click(function(){
if($(this).is(':checked')){
$("input[name='openOrClose']").prop("checked",true);
}else{
$("input[name='openOrClose']").prop("checked",false);
}
});
});
function getCheckedNum(){
var checkedNum=0;
$("input[name='openOrClose']").each(function(i,value){
if(true == $(this).is(':checked')){
checkedNum++;
}
});
return checkedNum;
}
</script>