jQuery Selectors(選取器)的使用(九、表單對象屬性篇)

本系列文章分為：基本篇、層次篇、簡單篇、內容篇、可見度篇、屬性篇、子項目篇、表單篇、表單對象屬性篇共9篇文章。
本篇講解：:enabled,:disabled,:checked,:selected的用法。
您對本系列文章有任何建議或意見請發送到郵箱：sjzlgt@qq.com
由於是第一次寫技術性系列文章，難免會出錯或代碼BUG，歡迎指出，在此謝過！
運行後，需要重新整理下，載入下jquery xmlns="http://www.w3.org/1999/xhtml" >

jQuery-Selectors(選取器)的使用(九、表單對象屬性篇)

本系列文章主要講述jQuery架構的選取器(Selectors)使用方法，我將以執行個體方式進行講述，以簡單，全面為基礎，不會涉及很深，我的學習方法：先入門，後進階！

本系列文章分為：基本篇、層次篇、簡單篇、內容篇、可見度篇、屬性篇、子項目篇、表單篇、表單對象屬性篇共9篇文章。

本篇講解：:enabled,:disabled,:checked,:selected的用法。

您對本系列文章有任何建議或意見請發送到郵箱：sjzlgt@qq.com

由於是第一次寫技術性系列文章，難免會出錯或代碼BUG，歡迎指出，在此謝過！

您可以到jQuery官網來學習更多的有關jQuery知識。

著作權：code-cat 部落格:http://www.cnblogs.com/bynet 轉載請保留原作者、出處和著作權資訊！在IE6、IE7、Firefox下測試過了，效果都能實現。1. :enabled用法

定義：匹配所有可用元素

傳回值：Array<Element>

執行個體：將ID為"div_a1"的DIV中所有可用的input元素的背景色改為紅色

代碼： $("#div_a1 input:enabled").css("background-color","red"); //點擊按鈕一將執行這句代碼

DIV ID="div_a1"

span ID="span_a1"

texteara </p><select><option>select</option></select><p><input type="button" id="btn_1" value="按鈕一" class="button">2. :disabled用法

定義：匹配所有不可用元素

傳回值：Array<Element>

執行個體：將ID為"div_b1"的DIV中所有停用input元素的背景色改為紅色

代碼： $("#div_b1 input:disabled").css("background-color","red"); //點擊按鈕二將執行這句代碼

DIV ID="div_b1"

span ID="span_b1"

texteara </p><select><option>select</option></select><p><input type="button" id="btn_2" value="按鈕二" class="button">3. :checked用法

定義：匹配所有選中的被選中元素(複選框、單選框等，不包括select中的option)

傳回值：Array<Element>

執行個體：將ID為"div_c1"的DIV中所有包含選中狀態複選框的元素背景色改為紅色

代碼： $("#div_c1 :has(input[type='checkbox']:checked)").css("background-color","red"); //點擊按鈕三將執行這句代碼

DIV ID="div_c1"

span ID="span_c1"

DIV id="div_c1_1"
DIV id="div_c1_2"
DIV id="div_c1_3"
DIV id="div_c1_4"

注意：:has(selector)用法參見內容篇&可見度篇第3點，
[type='checkbox']用法參見屬性篇第2點。4. :selected用法

定義：匹配所有選中的option元素

傳回值：Array<Element>

執行個體：將ID為"div_d1"的DIV中所有select元素中選中的option元素的text值寫入div_d1_1中

代碼： var SelectedText=$("#div_d1 :selected"); //點擊按鈕四將執行這句代碼

DIV ID="div_d1"

span ID="span_d1"

span option1span option2span option3

div select1div C#div VBdiv jQuerydiv select2div Applediv Interdiv Googlediv select3div U.S.A.div U.K.div ChinaDIV id="div_d1_1"

注意：append(content)指向某元素內部追加content，在以後的章節中會有講解，敬請關注。