表单域选择器：
专门用于从文档中选择表单域，均以：开头
表单域指：input,textarea,select,button元素
Input具有各种各样的type属性值：text,password,radio,checkbox等。
1】:input选择器:用于选择所有input,textarea,select,button元素
语法：$(“:input”)
2】:text选择器:用于选择所有单行文本框（<input type=”text”/>）
语法：$(“:text”)
3】:password选择器:用于选择所有密码框（<input type=”password”/>）
语法：$(“:password”)
4】:radio选择器：用于选择所有单选按钮（<input type=”radio”/>）
语法：$(“:radio”)
5】:checkbox选择器:用于选择所有复选框（<input type=”checkbox”/>）
语法：$(“:checkbox”)
6】:file选择器：用于选择所有的文本域（<input type=”file”/>）
语法：$(“:file”)
7】:image选择器:用于选择所有的图像域（<input type=”image”/>）
语法：$(“:image”)
8】:hidden选择器:用于选择所有不可见元素（css display属性值为none）以及隐藏域（<input type=”hidden”/>）
语法：$(“:hidden”)
9】:button选择器:用于选择所有的按钮（<input type=”button”/>）
语法：$(“:button”)
10】:submit选择器:用于选择所有的提交按钮（<input type=”submit”/>）
语法：$(“:submit”)
11】:reset选择器:用于选择所有的重置按钮（<input type=”reset”/>）
语法：$(“:reset”)
注：button元素同时属于$(“:button”) 和 $(“:submit”)
综合例子：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<script type="text/javascript" src="F://jQuery_study/jquery-1.11.1.min.js"></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" /> <input type="radio" /></td>
<td>复选框</td>
<td> <input type="checkbox" /> <input type="checkbox" /></td>
</tr>
<tr>
<td height="36">图像</td>
<td> <input type="image" /></td>
<td>文件域</td>
<td> <input type="file" /></td>
</tr>
<tr>
<td height="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">文本区域：</td>
<td colspan="3"><textarea cols="70" rows="3"></textarea></td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function(){
$(":text").attr("value","文本框");
$(":password").attr("value","密码框");
$(":radio:eq(0)").attr("checked","true");
$(":checkbox").attr("checked","true");
$(":image").attr("src","IOC.IOC");
$(":file").css("width","200px");
$(":hidden").attr("value","已保存的值");
$("select").css("background","#FCF");
$(":submit").attr("id","btn1");
$(":reset").attr("name","btn");
$("textarea").attr("value","文本区域");
})
</script>
</body>
</html>
效果图：
990
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
