
現(xiàn)在來看看表單域選擇器

1.:input選擇器
:input選擇器,用于選擇所有Input,textarea,select和button元素,語法格式如下:
$(":input")
2.:text選擇器
:text選擇器用于選擇所有的單行文本框(<input type="text"/>),語法格式如下。
$(":text")
3.:passWord選擇器
:password選擇器用于選擇所有密碼框(<input type="password"/>),語法格式如下:
$(":password")
4.:radio選擇器
:radio選擇器,用于選擇所有單選按鈕(<input type="radio"/>),語法格式如下:
$(":radio")
5.:checkbox選擇器
:checkbox選擇器,用于選擇所有復(fù)選框(<input type="checkbox"/>),語法格式如下。
$(":checkbox")
6.:file選擇器
:file選擇器,用于選擇所有文件域(<input type="file"/>),語法格式如下:
$(":file")
7.:image選擇器
:image選擇器,用于選擇所有圖像域(<input type="image"/>),語法格式如下。
$(":image")
8.:hidden選擇器
:hidden選擇器,用于選擇所有不可見的元素(CSS display屬性值為none)以及隱藏域(<input type="hidden"/>),語法格式,如下:
$(":hidden")
9.:button選擇器
:button選擇器,用于選擇所有按鈕(<input type="button"/>)和<button></button>,,語法格式如下:
$("button")
10.:submit選擇器
:submit選擇器,用于選擇所有提交按鈕(<input type="submit"/>)和<button></button>
$(":submit")
11.:reset選擇器
:reset選擇器,用于選擇所有重置按鈕(<input type="reset"/>),語法格式如下:
$(":reset")
注意:<button></button>元素,屬于同時用$(":button")和$(":submit")返回的元素數(shù)組。
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title>表單域選擇器</title>    <script type="text/javascript" src="js/jquery-1.11.0.js"></script>    <script type="text/Javascript">        //文本框被點擊的時候,設(shè)置其背景色為黃色        $(function () {            $(":text").click(function () {                $(this).css("background-color", "yellow");            });        });        //鼠標(biāo)移到密碼框上面的時候,顯示:“你輸入的密碼是加密的!”        $(document).ready(function () {            $(":password").mouSEOver(function () {                alert("你輸入的密碼是加密的!")            });        });        //點擊男的時候,選擇女,點擊女的時候,選擇男        $(document).ready(function () {            $(":radio").eq(0).click(function () {                $(":radio").eq(1).attr("checked", "true");            });            $(":radio").eq(1).click(function () {                $(":radio").eq(0).attr("checked", "true");            });        });        //點擊復(fù)選框的時候,彈出我是復(fù)選框        $(function () {            $(":checkbox").click(function () {                alert("我是復(fù)選框");            });        });              //點擊文件域的時候,顯示,我是文件域        $(function () {            $(":file").click(function () {                alert("我是文件域");            });        });          </script></head><body>    <table width="645" height="145" border="1">        <tr>            <td width="89" height="23">文本框</td>            <td width="194"><input type="text"/></td>            <td width="74">密碼框</td>            <td width="260"><input type="password"/></td>        </tr>        <tr>            <td height="24">單選按鈕</td>            <td><input type="radio" name="groupName"/>男<input type="radio" name="groupName" />女</td>            <td>復(fù)選框</td>            <td><input type="checkbox"/><input type="checkbox"/></td>        </tr>        <tr>            <td width="36">圖像</td>            <td><input type="image"/></td>            <td>文件域</td>            <td><input type="file"/></td>        </tr>        <tr>            <td width="23">隱藏域</td>            <td><input type="hidden"/>(不可見)</td>            <td>下拉列表</td>            <td>                <select>                      <option>選項一</option>                      <option>選項二</option>                      <option>選項三</option>                </select>            </td>        </tr>        <tr>            <td height="25">提交按鈕</td>            <td><input type="submit"/></td>            <td>重置按鈕</td>            <td><input type="reset"/></td>        </tr>        <tr>            <td valign="top">文本區(qū)域</td>            <td colspan="3"><textarea cols="70" rows="3"></textarea></td>        </tr>    </table></body></html>今天就到這里了。。
新聞熱點
疑難解答