js checkbox選中狀態

標籤：代碼   頁面   jquer   box   checked   元素   als   input   inpu   

jquery擷取checkbox的選中狀態

$(‘#checkboxID‘).attr(‘checked‘);

發現，以上代碼，無論input checkbox是選中還是未選中狀態，無論IE還是Chrome，返回結果都是undefinded；

查閱發現：jquery1.6版本對此作了修改，checked屬性在頁面初始化的時候就已經初始化好了，不會隨著狀態改變而變。也就是說checkbox在頁面載入完畢是選中狀態，則永遠返回checked，如果一開始沒被選中，則永遠返回undefinded。

 

在Jquery 1.6及之後，新加了一個方法prop()，通過attr方法去獲得屬性，通過prop方法去獲得特性。在遇到要擷取或設定checked,selected,readonly和disabled等屬性時，用prop方法。

官方解釋prop():擷取在匹配的元素集中的第一個元素的屬性值。

大家都知道有的瀏覽器只要寫disabled，checked就可以了，而有的要寫成disabled = "disabled"，checked="checked"，比如用attr("checked")擷取checkbox的checked屬性時選中的時候可以取到值,值為"checked"但沒選中擷取值就是undefined。

jq提供新的方法“prop”來擷取這些屬性，就是來解決這個問題的，以前我們使用attr擷取checked屬性時返回"checked"和"",現在使用prop方法擷取屬性則統一返回true和false。

那麼，什麼時候使用attr()，什麼時候使用prop()？
1.添加屬性名稱該屬性就會生效應該使用prop();
2.是有true,false兩個屬性使用prop();
3.其他則使用attr();

以下是官方建議attr(),prop()的使用：

Attribute/Property	.attr()	.prop()
accesskey	√
align	√
async	√	√
autofocus	√	√
checked	√	√
class	√
contenteditable	√
draggable	√
href	√
id	√
label	√
location ( i.e. window.location )	√	√
multiple	√	√
readOnly	√	√
rel	√
selected	√	√
src	√
tabindex	√
title	√
type	√
width ( if needed over .width() )	√

js checkbox選中狀態