1.4:表单选择器：
:input，匹配所有的input,textarea,select和button元素，$(":input");
:text,匹配所有的文本框,查找所有的文本框$(":text');
:password,匹配所有的密码框.$(":password");
:radio,匹配所有的单选按钮，$(":radio");
:checkbox，匹配所有的复选框$(":checkbox");
:submit,匹配所有的提交按钮$("submit");
:image，匹配所有的图像域 $("image");
:reset,匹配所有的重置按钮,$(":reset")
:button,匹配所有的按钮,$(":button");
:file，匹配所有的文件域，$(":file");
案例如下：
class="java"> <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>表单选择器测试</title>
<link rel="stylesheet" href="js/css.css" type="text/css"></link>
<!-- ************************** 导入 *********************************** -->
<script type="text/javascript" src="js/jquery-1.8.3.js">
</script>
<!-- ************************************************************* -->
<script type="text/javascript">
//程序入口
$(document).ready(function() {
test();
});
//测试
function test() {
//$(":input").css("background-color","red"); //获取所有的表单元素；包含文本域，单选，选择，复选
//$(":password").css("background-color","red"); //获取类型为password的元素
//$(":password[name=a]").css("background-color","red"); //获取类型为password 并且name=a 的元素
//$(":submit").css("background-color","red"); //获取type=submit 的所有元素
//$(":image").css("background-color","red");
//$(":file").css("background-color","red");
//$(":radio").css("background-color","red");
}
</script>
</head>
<body>
<h3>
表单选择器
</h3>
<table id="tab"">
<tr>
<td>
姓名：
</td>
<td>
<input type="text" disabled="disabled" name="username" />
</td>
</tr>
<tr>
<td>
密码：
</td>
<td>
<input type="password" disabled="disabled" />
<input type="password" name="a" disabled="disabled" />
</td>
</tr>
<tr>
<td>
爱好：
</td>
<td>
<input type="checkbox" name="love" value="0"/>睡觉
<input type="checkbox" name="love" value="1"/>上网
<input type="checkbox" name="love" value="2"/>吃饭
<input type="checkbox" name="love" value="3"/>散步
<input type="checkbox" name="love" value="4"/>代码
</td>
</tr>
<tr>
<td>
军衔：：
</td>
<td>
<select name="myselector" id="myselector">
<option value="0">少校</option>
<option value="1">中尉</option>
<option value="2">上尉</option>
<option value="3">司令</option>
</select>
</td>
</tr>
<tr>
<td>
备注：
</td>
<td>
<textarea rows="5" cols="15" name="content"></textarea>
</td>
</tr>
<tr>
<td>
<input type="image"/>
</td>
<td>
<input type="file" name="username" />
</td>
</tr>
<tr>
<td>
<input type="radio" name="sex"/>男
<input type="radio" name="sex"/>女
</td>
<td>
<input type="submit" value="submit" />
</td>
</tr>
<tr>
<td colspan="2"><input type="button" id="mybtn" value="提交"/></td>
</tr>
</table>
</body>
</html>
相关文章
