jQuery 之表单选择器

最新推荐文章于 2022-01-25 07:00:00 发布

zjsunzone

最新推荐文章于 2022-01-25 07:00:00 发布

阅读量111

点赞数

分类专栏： jQuery 文章标签： jquery html java 表单选择器 ViewUI

本文链接：https://blog.csdn.net/zjsunzone/article/details/84499042

版权

jQuery 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

[size=medium][b][color=red][align=center]1.4:表单选择器：[/align][/color][/b][/size]
[size=small][color=olive][b][align=left] :input，匹配所有的input,textarea,select和button元素，$(":input");
:text,匹配所有的文本框,查找所有的文本框$(":text');
:password,匹配所有的密码框.$(":password");
:radio,匹配所有的单选按钮，$(":radio");
:checkbox，匹配所有的复选框$(":checkbox");
:submit,匹配所有的提交按钮$("submit");
:image，匹配所有的图像域 $("image");
:reset,匹配所有的重置按钮,$(":reset")
:button,匹配所有的按钮,$(":button");
:file，匹配所有的文件域，$(":file");[/align][/b][/color][/size]

[size=small][b][color=red][align=center]案例如下：[/align][/color][/b][/size]

		<%@ 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>

zjsunzone

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery 之表单选择器

[size=medium][b][color=red][align=center]1.4:表单选择器：[/align][/color][/b][/size] [size=small][color=olive][b][align=left] :input，匹配所有的input,textarea,select和button元素，$(":input"); :text,匹配所有的文本...
复制链接

扫一扫

专栏目录