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");
案例如下：
<%@ 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>
分享到：
相关推荐
**jQuery表单选择器源码解析** jQuery是一个广泛使用的JavaScript库，它极大地简化了JavaScript的DOM操作、事件处理、动画效果以及Ajax交互。在jQuery中，表单选择器是用于高效地定位和操作HTML表单元素的重要工具...
jQuery UI则是jQuery的一个扩展，提供了各种可重用的UI组件和交互效果，如对话框、滑块、排序列表、日期选择器等。 **表单设计**是Web应用中的重要组成部分，它允许用户输入和提交数据。jQuery UI表单设计器通过...
最后，表单选择器如`:$(":input")`选取所有输入元素，`:$(":text")`选取所有文本输入框，`:$(":radio")`选取所有单选按钮等，方便我们对表单元素进行操作。 通过上述的练习题，你可以实践并巩固这些选择器的用法。...
5. **插件扩展**：许多设计器允许用户安装或开发自定义插件，以增加更多功能，如日期选择器、文件上传等。 6. **响应式设计**：考虑到移动设备的广泛使用，好的表单设计器会提供响应式布局，确保表单在不同设备上都...
在网页开发中，jQuery时间选择器是一个非常实用的工具，它允许用户通过点击来选取特定的小时和分钟，为表单输入提供了便利。这个“jQuery时间选择器点击选择小时分钟代码”很可能是一个实现这一功能的代码示例或者...
在本文中，我们将深入探讨jQuery日期时间选择器插件，这是一种高效、美观的JavaScript解决方案，用于在网页上添加交互式的日期和时间选择功能。这款插件利用jQuery库的强大功能，为用户提供了简单易用的界面，使他们...
**jQuery UI 时间选择器详解** 在网页开发中，用户界面的交互性和易用性是至关重要的，而日期和时间选择器则是提升用户体验的一种常见方法。jQuery UI 提供了一个功能强大的时间选择器组件，使得开发者可以轻松地在...
选择器按功能分为基础选择器、层次选择器、属性选择器、表单选择器、可见性选择器、位置选择器、子元素选择器、内容选择器、属性选择器、表单对象属性选择器以及过滤选择器。每类选择器都有其独特的应用场景，熟悉并...
《jQuery商品价格选择器详解与应用》 在Web开发中，jQuery库因其简洁易用的API和强大的功能，被广泛应用于各种交互设计中。本文将深入探讨如何利用jQuery实现一个商品价格选择器，以提升用户体验并优化购物过程。 ...
在JavaScript开发中，表单日历控件和时间选择器是常见的需求。它们允许用户以图形化的方式选择日期和时间，而无需手动输入。这些控件通常具有良好的用户反馈，如日期和时间的实时预览，以及错误验证，以确保输入的...
《jQuery城市选择器详解》 在网页开发中，常常需要为用户提供便捷的城市选择功能，以满足用户在填写地址或选择服务区域时的需求。jQuery城市选择器便是为此而设计的工具，它结合了jQuery库的强大功能，实现了高效、...
文本框是最常见的表单元素之一。使用jQuery获取文本框的值非常简单： ```javascript var textVal = $("#text_id").val(); // 使用.val()方法获取值 ``` **注意：** `.val()` 方法是用来获取或设置表单元素的值的，...
jQuery UI的日期选择器（jQuery datepicker）是一个广泛使用的组件，尤其在网页表单中用于输入日期时。这个组件提供了一个优雅、用户友好的界面，允许用户通过日历视图来选择日期，而不是手动输入。在中文环境中，...
jQuery城市选择器是网页表单设计中常用的一种组件，通过合理的数据结构和事件驱动，实现了级联选择的效果。理解其工作原理，并结合实际项目需求进行优化，能有效提升网站的用户体验和交互性。随着前端技术的不断发展...
而"jQuery插件颜色选择器"是jQuery生态中的一款实用工具，用于帮助用户在网页上方便地选取颜色。这类插件通常提供一个交互式的颜色面板，允许用户通过鼠标点击或滑动来选择所需的颜色值，适用于各种需要颜色输入的...
选择器作为jQuery的核心组件之一，扮演着桥梁的角色，连接DOM操作与CSS选择。本文旨在深入解析jQuery提供的48个选择器，并通过21幅图演示，帮助读者全面理解并高效运用这些选择器，提升日常编码效率。 #### 一、...
"jquery双向选择器代码"这个主题涉及的是jQuery中一种特殊的选择器机制，它允许我们从DOM（文档对象模型）中选取元素，同时还能根据某个元素选取其关联的元素，实现数据的双向绑定或者元素间的交互效果。这种功能在...
7. **表单选择器** - `:input`：选择所有表单元素，如`$("input, textarea, select, button")`。 - `:checkbox`，`:radio`，`:file`，`:password`，`:text`等：根据表单元素类型进行选择。 通过这些选择器，...
5. **表单选择器**：专门用于选取表单元素，如`$(":input")`选取所有输入元素，`$(":text")`选取所有文本输入框，`$(":checkbox")`选取所有复选框。 6. **上下文选择器**：`$("selector", context)`允许在特定上...
【jQuery日期时间选择器集合插件】是一款专为前端开发者设计的强大工具，它结合了Bootstrap框架和jQuery库，为网页应用程序提供了丰富的日期和时间选择功能。这个插件旨在简化用户在网页上输入日期和时间的过程，...