代码如下: <%@ Page Language=”C#” AutoEventWireup=”true” CodeBehind=”JQuery3.aspx.cs” Inherits=”JQuery_1.JQuery3″ %> <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=”http://www.w3.org/1999/xhtml” > <head runat=”server”>
在本篇"JQuery从头学起第三讲"中，我们将深入探讨如何使用jQuery来获取网页中不同类型的表单元素的值。看到代码片段，这是一个基于ASP.NET的网页，其中包含了一些基本的HTML元素，如文本框、密码框、复选框、隐藏字段、单选按钮以及下拉列表，所有这些都是为了演示jQuery的选择器和取值功能。
1. **jQuery选择器**：jQuery选择器是用于定位和选择HTML元素的关键部分。在示例中，我们看到了以下几种选择器：
- `$("#txt1")`：通过ID选择器选取ID为"txt1"的文本框。
- `input[name=’ck’]:checked`：通过属性选择器选取名称为"ck"且被选中的复选框。
- `#h1`：同样通过ID选择器选取ID为"h1"的隐藏字段。
- `input[name=’rdo’]:checked`：选取名称为"rdo"且被选中的单选按钮。
- `#ss`：通过ID选择器选取ID为"ss"的下拉列表。
- `select[name=’s1′] option[value=' + v6 + ']` 和 `select[id=’ss’] option[value=' + v6 + ']`：使用复合属性选择器选取与特定值匹配的下拉列表选项。
2. **获取表单元素的值**：
- `val()` 方法用于获取元素的值，例如 `$(“#txt1”).val()` 获取文本框的输入值。
- `attr("value")` 也可以获取文本框的值，对于大部分元素，它与 `val()` 效果相同。
- `$(“input[name=’ck’]:checked”).val()` 获取选中的复选框的值。
- `$(“#h1”).val()` 获取隐藏字段的值。
- `$(“input[name=’rdo’]:checked”).val()` 获取选中的单选按钮的值。
- `$(“#ss”).val()` 获取下拉列表选中的选项的值。
- `$(“select[name=’s1′] option[value='” + v6 + “‘]”).text()` 和 `$(“select[id=’ss’] option[value='” + v6 + “‘]”).text()` 分别通过name和ID获取下拉列表选中项的文本。
3. **复合属性选择器**：当需要根据多个属性条件来选取元素时，可以使用复合属性选择器。例如，`input[name=’ck’]:checked` 选取了名称为"ck"且被选中的复选框。
4. **事件处理**：在示例中，`onclick=”Get()”` 绑定了一个点击事件，当用户点击按钮时会执行 `Get` 函数，该函数通过jQuery获取并显示所有表单元素的值。
5. **使用场景**：这些操作在网页开发中非常常见，特别是在页面初始化或响应用户交互时，我们需要获取用户的输入数据，或者根据特定条件改变元素的值。
在接下来的讲解中，我们将探讨如何使用jQuery为这些常见的表单控件赋值，这在构建动态网页时是非常重要的，因为它允许我们根据需要更新界面状态，为用户提供反馈，或进行数据验证。理解这些基础操作对于熟练掌握jQuery至关重要，因为它们构成了更复杂交互和动画效果的基础。
