Jquery attr("checked") 返回checked或undefined

來源:互聯網
上載者:User

假設我們現在需要這樣的情境:頁面上有一個checkbox,我們期望通過Jquery來獲得它是否選中,或者通過Jquery來讓它被選中。
在JQ1.6之前的版本,我們會這樣寫我們的代碼:
複製代碼 代碼如下:
<input type='checkbox' id='cb'/>
<script>
//擷取是否選中
var isChecked = $('#cb').attr('checked');

//設定選中
$('#cb').attr('checked',true);
</script>

這樣寫在JQ1.6之前完全沒問題,可是當我們升級JQ1.6到更高的版本時,問題就來了,此時我們會發現:
$('#cb').attr('checked'); 返回的是checked或者是undefined,不是原來的true和false了。
並且checked屬性在頁面初始化的時候已經初始化好了,不會隨著狀態的改變而改變。所以如果checkbox一開始是選中的,那麼返回的是checked,如果一開始沒被選中,則返回的是undefined。

解決的方法是:
複製代碼 代碼如下:
<input type='checkbox' id='cb'/>
<script>
//擷取是否選中
var isChecked = $('#cb').prop('checked');
//或
var isChecked = $('#cb').is(":checked");
//設定選中
$('#cb').prop('checked',true);
</script>

分析了其中的原因,可以這樣理解:

它將“屬性”與“特性”做了區別,屬性指的是“name,id”等等,特性指的是“selectedIndex, tagName, nodeName”等等。
JQ1.6之後,可以通過attr方法去獲得屬性,通過prop方法去獲得特性
複製代碼 代碼如下:
$("#cb").attr("tagName"); //undefined
$("#cb").prop("tagName"); //INPUT

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.