最近使用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>