jQuery就業課程之表單選擇器系列

表單選擇器

重要，不難

求同存異，利用之前的知識，遷移過來。判斷的是表單的類型，注意，判斷的是表單元素的類型，類型，類型。

名稱 說明 解釋

$(:input) 匹配所有 input, textarea, select 和 button 元素 查找所有的input元素: $(":input")

$(:text) 匹配所有的文本框 查找所有文本框: $(":text")

$(:password) 匹配所有密碼框 查找所有密碼框: $(":password")

$(:radio） 匹配所有單選按鈕 查找所有單選按鈕

$(:checkbox) 匹配所有復選框 查找所有復選框: $(":checkbox")

$(:submit) 匹配所有提交按鈕 查找所有提交按鈕: $(":submit")

$(:image) 匹配所有圖像域 匹配所有圖像域: $(":image")

$(:reset) 匹配所有重置按鈕 查找所有重置按鈕: $(":reset")

$(:button) 匹配所有按鈕 查找所有按鈕: $(":button")

$(:file) 匹配所有文件域 查找所有文件域: $(":file")

表單屬性過濾器

語法 描述 示例

:enabled 匹配所有可用元素 $(" #userform :enabled" )匹配form內部除編號輸入框外的所有元素

:disabled 匹配所有不可用元素 $(" #userform :disabled" )匹配編號輸入框

:checked 匹配所有被選中元素（復選框、單項按鈕、select 中的option） $(" #userform :checked" )匹配“性別”中的“男”選項和“愛好”中的“編程”選項

:selected 匹配所有選中的option 元素,單一的下拉框 $(" #userform :selected" ) 匹配“家鄉”中的“北京”選項

2.6 屬性操作

jquery的屬性操作模塊分為四個部分：html屬性操作，dom屬性操作，類樣式操作和值操作

html屬性操作：是對html文檔中的屬性進行讀取，設置和移除操作。比如attr()、removeAttr()

DOM屬性操作：對DOM元素的屬性進行讀取，設置和移除操作。比如prop()、removeProp()

類樣式操作：是指對DOM屬性className進行添加，移除操作。比如addClass()、removeClass()、toggleClass()

值操作：是對DOM屬性value進行讀取和設置操作。比如html()、text()、val()

正則：

/^[0-9a-zA-Z][0-9a-zA-Z_.-]{2,16}[0-9a-zA-Z]$/ 賬號最少4位 /^([\u4e00-\u9fa5]|\w|[@!#$%&*])+$/; 密碼 /^(13|15|18)\d{9}$/; 手機號 /^\w+@\w+(\.[a-zA-Z]{2,3}){1,2}$/; 郵箱

1

2

3

4

總結：

1.選擇器重點講了好幾個，今天是表單選擇器；

2.掌握如何針對某個選擇器進行操作，規律:三個字總結:找 事 匿

3.jQuery鏈式操作

2.6 作業

使用jQuery+正則表達式，對表單注冊進行簡單的驗證。需要大家去復習正則表達式的使用 。

復習代碼：