2024年5月1日发(作者：)

第8章 网页标准控件

控件是一种类，绝大多数控件都具有可视的界面，能够在程序运行中显示出其外观。利

用控件进行可视化设计既直观又方便，可以实现“所见即所得”(What You See Is What You

Get，简称为WYSIWYG)的效果。程序设计的主要内容是选择和设置控件以及对控件的事件

编写处理代码。

本章将介绍网页中最常用的几个标准网页控件。目的在于学会这些常用控件的使用方

法。其他控件在后续的章节中介绍。

8.1网页中的控件类型

的类库中包括大量的控件，根据功能可以将它们分成以下几种类型。

标准控件：这些控件属于服务器控件。除窗体页中常用的按钮、文本框等控件以外，还

有一些特殊用途的控件，例如，显示日历的控件等。网页标准控件与HTML元素标记之间

不存在一对一的对应关系。

验证控件：用于检验用户的输入。例如，验证是否缺少必须填入的字段；输入的数据格

式是否符合要求；输入的数据是否在指定的范围内等。

用户控件及自定义控件：这些控件都是由程序设计者自行定义的控件，是对系统控件的

扩展。用户控件可以在项目内不同网页中重复使用，从而提高了程序设计的效率，同时还能

使各网页的显示风格一致。

HTML控件：默认情况下它属于客户端(浏览器端)控件，但也可以将其转换成服务器端

控件。每个控件对应于一个HTML元素的标记。

数据源控件

这类控件可以针对各种数据源实现数据绑定功能，这包括微软的SQL Server和Access，

以及其他关系型数据库、XML文件和代码中实现的类。

数据视图控件

这类控件呈现为各种列表和表格，它们可以绑定到数据源以显示和编辑数据。

个性化控件

这类控件允许用户个性化地展示自己的站点，包括重新调整网页本身等。用户信息会被

自动地、透明地保存，并从一个会话持续到下一个会话。

登录控件和安全控件

这类控件实现站点中的普通登录功能，并维护用户的密码。

组合控件：由多个标准控件组合而成，能够完成如客户认证等比较复杂的功能。

2.0增加了近60个控件，其中有不少是功能强大的组合控件，从而大大提高

了快速开发的能力。

8.2 HTML控件转换成服务器控件

HTML控件是从基类 ntrol 直接或间接派生的类，

并且都直接映射到 HTML 元素上。默认情况下HTML控件属于浏览器端控件，服务器无

法控制。这些元素被视为传递给浏览器的不透明的文本。这些不透明的文本被传送到浏览器

后由浏览器下载并负责解释、执行。

但是，为了适应应用的需要，可以将 HTML 元素转换成 HTML 服务器控

件，从而在服务器端对它们进行编程和处理。

将HTML 控件转换成服务器控件非常简单。下面举例说明。

例如，想将一个Text Field浏览器端控件转换成服务器端控件，转换的方法如下：

用手工方法在控件的定义中增加runat="server"属性，该控件就变成了服务器端控件。

如果原来的HTML控件中没有id属性时，也应该补上。增加上述属性后，控件的定义如下：

HTML控件的功能在前面HTML章节中已经详细介绍，这里不再作讨论

8.3网页标准控件功能和格式

在 2.0的【工具箱】中，只有HTML选项卡中的控件是浏览器端控件，其他

各种控件都是服务器控件。其中【标准】选项卡中的控件是常用的控件。在类库中，所有的

网页控件都是从trols直接或间接派生而来的。

1．网页标准控件的功能

在【工具箱】的【标准】选项卡中包括有几十个标准控件。这些控件中既有传统的窗体

控件，例如，按钮、选择控件、文本框等，还有用来显示数据、选择日期等比较复杂的控件。

其中，有的控件还具有很高的智能，例如：

能自动检测浏览器的类型，并根据浏览器的类型提供不同的输出。

能够使用模板来定义控件的外观。

可以选择事件信息传送的方式，是立即发送给服务器，还是先缓存然后再和其他信息一

起传送给服务器。

有的控件可将事件信息从嵌套控件(例如表中的按钮)传递到它的容器控件。

2．定义标准控件的格式

定义网页标准控件的格式如下：

其中asp代表命名空间，所有的Web服务器控件的命名空间都是asp；Control代表控

件的类型；id代表控件的标志；runat="server"代表这是一个服务器控件，默认情况下，所有

标准控件都是服务器控件。

例如，定义Label、TextBox、Button等网页控件的代码如下。

8.4．设置控件的属性和事件处理程序

开发人员通过从“工具箱”窗口拖放控件到设计页面上，并利用属性浏览器为其设置属

性和事件。大多数控件都拥有一些共有的属性与事件，例如ID、Text属性以及Click事件

等。让我们通过几个简单的控件来熟悉为控件设置属性和添加事件的基本方法。

首先，创建一个 网站，切换到页面的“设计”视图，从“工具

箱”的“标准”组中将一个Label控件拖放到页面上。右击该控件，在菜单中选择【属性】，

展开“属性”窗口（图11-1）。

在设置Label控件的属性前，先对“属性”窗口做一个了解。