Jquery李炎恢——15表單選擇器


學習要點:
1.常規選擇器

2.表單選擇器

3.表單過濾器

表單作為HTML中一種特殊的元素,操作方法較為多樣性和特殊性,開發者不但可以使用之前的常規選擇器或過濾器,也可以使用Jquery為表單專門提供的選擇器和過濾器來准確的定位表單元素。

一、常規選擇器

我們可以使用id、類(class)和元素名來獲取表單字段,如果是表單元素,都必須含有name屬性,還可以結合屬性選擇器來精准定位。

$("input").size();                    //input的個數

$("input").val();                     //元素名定位,默認獲取第一個

$("input").eq(1).val();            //同上,獲取第二個

$("input[type=password]").val();        //選擇type為password的字段

$("input[name=user]").val();              //選擇name為user的字段


那么對於id和類(class)用法比較類似,也可以結合屬性選擇器來精確的定位,在這里我們不再重復。對於表單中的其他元素名比如:textarea,select和button等,原理一樣,不再重復。


二、表單選擇器

雖然可以使用常規選擇器來對表單的元素進行定位,但有時還是不能滿足開發者靈活多變的需求。所有,jquery為表單提供了專門的選擇器。


:input :選擇所有input、textarea、select和button元素,返回元素集合

:text:選擇所有單行文本框,即type=text,返回元素集合

:password:選擇所有密碼框,即type=password,返回元素集合

:radio:選擇所有單選框,即type=radio,返回元素集合

:checkbox:選擇所有復選框,即type=checkbox,返回元素集合

:submit:選擇所有提交按鈕,即type=submit,返回元素集合

:reset:選擇所有重置按鈕,即type=reset,返回元素集合

:image:選擇所有圖像按鈕,即type=image,返回元素集合

:button:選擇所有普通按鈕,即type=button,返回元素集合

:file :選擇所有文件按鈕,即type=file,返回元素集合

:hidden:選擇所有不可見字段,即type=hidden,返回元素集合

 

$(":input").size();            //獲取所有表單字段元素

$(":text").size();              //獲取單行文本框元素

$(":password").size();    //獲取密碼欄元素

$(":radio").size();           //獲取單選框元素

$(":checkbox").size();    //獲取復選框元素

$(":submit").size();         //獲取提交按鈕元素

$(":reset").size();           //獲取重置按鈕元素

$(":image").size();         //獲取圖片按鈕元素

$(":file").size();              //獲取文件按鈕元素

$(":button").size();         //獲取普通按鈕元素

$(":hidden").size();        //獲取隱藏字段元素

$("form:hidden").size();   //獲取form中所有表單字段元素

注意:這些選擇器都是返回元素集合,如果想獲取某一個指定的元素,最好結合一下屬性選擇器。比如:

$(":text[name=user]").size(); //獲取單行文本框name=user的元素


三、表單過濾器

jquery提供了四種表單過濾器,分別在是否可以用、是否選定來進行表單字段的篩選過濾。



:enabled:選取所有可用元素,返回集合元素

:disabled:選取所有不可用元素,返回集合元素

:checked:選取所有被選中的元素,單選和復選字段,返回集合元素

:selected:選取所有被選中的元素,下拉列表,返回集合元素


注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
粤ICP备14056181号  © 2014-2021 ITdaan.com