一、使用jquery判斷及改變checkbox選中狀態
1.使用JQuery判斷一個checkbox 是否為選中:
(1).attr('checked)
看JQuery版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false
(2).prop('checked')
1.6+:true/false
(3).is(':checked')
eg:$("input[type='checkbox']").is(':checked');選中為true,未選中為false;
所有版本:true/false
2.改變選中狀態
(1)使用attr方法進行checkbox狀態的改變。
選中:$("input[type='checkbox']").attr("checked",true);
取消選中:$("input[type='checkbox']").attr("checked",false);
(2)但是有時使用attr操作,雖然屬性值改變了,但是頁面上的checkbox並沒有選中。在這種情況下,建議使用prop方法來操作改變checkbox選中狀態。
選中:
$("input[type='checkbox']").prop("checked",true);
$("input[type='checkbox']").prop({checked:true}); //map鍵值對
$("input[type='checkbox']").prop("checked",function(){return true;});//函數返回true或false
$("input[type='checkbox']").prop("checked","checked");
取消選中:
$("input[type='checkbox']").prop("checked",false);
3.獲取value值
使用Jquery獲取checkbox的值,在沒有給value值的情況下,獲取的值為"on"。
使用Jquery獲取checkbox的值,給value值的情況下,獲取的值是value值。
4.舉例:實現反選
$(":checkbox").each(function(){ if($(this).prop("checked")){ $(this).prop("checked",false); }else{ $(this).prop("checked",true); } });
其中:
全選: $(":checkbox").prop("checked",true)
取消全選:$(":checkbox").prop("checked",false)
獲取選中的:$(":checkbox:checked")
二、使用javascript判斷及改變checkbox選中狀態
判斷:
document.getElementById("someCheckbox").checked //值為true或false
改變
document.getElementById("someCheckbox").checked = true;
document.getElementById("someCheckbox").checked = false;