本章内容

q 显示信息

q 接收用户输入

q 提交表单数据

q 显示图片

q 使用Panel控件

q 使用HyperLink控件

q 小结

本章学习如何使用ASP.NET 2.0 Framework的核心控件。这些控件几乎是创建每个ASP.NET应用程序都要用到的。

你将学习如何使用Label和Literal控件显示信息，如何使用TextBox、CheckBox和RadioButton控件来接收用户输入，以及如何通过Button控件提交表单数据。

在本章的最后部分，学习如何使用Panel控件对表单字段进行分组。最后，学习使用HyperLink控件从一个页面链接到另一个页面。

2.1 显示信息

ASP.NET Framework中有两个控件用于在页面中显示文本：Label控件和Literal控件。Literal控件简单地显示文本，Label控件还支持一些附加的格式化属性。

2.1.1 使用Label控件

如果需要动态地修改显示在页面中的文本，可以使用Label控件。例如，代码清单2-1中的页面动态地修改了Label控件的Text属性值来显示当前的时间（见图2-1）。

代码清单2-1 ShowLabel.aspx

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

void Page_Load()

{

lblTime.Text = DateTime.Now.ToString("T");

}

</script>

<title>Show Label</title>

</head>

<body>

<div>

<asp:Label

id="lblTime"

Runat="server" />

</div>

</form>

</body>

</html>

图2-1 用Label控件显示时间

在呈现控件时，任何赋给Label控件的Text属性的字符串将通过Label控件显示出来。可以给Text属性赋值简单的文本或HTML内容。

作为把文本赋值给Text属性的替代方法，可以把文本放在Label控件的起始标签和结束标签之间。任何放置在起始标签和结束标签之间的文本都会赋值给Text属性。

Label控件默认地把它的内容呈现在一个HTML <span>标签中。赋给Text属性的任何值，都会包含在一个<span>标签中呈现到浏览器上。

Label控件支持一些格式化自身显示的文本的属性（下面是一个不完整列表）：

q BackColor——用于改变Label的背景色。

q BorderColor——用于设置呈现在Label周围的边框的颜色。

q BorderStyle——设置显示在Label周围的边框。可用的值有：NotSet、None、Dotted、Dashed、Solid、Double、Groove、Ridge、Inset和Outset。

q BorderWidth——设置呈现的Label边框的宽度。

q CssClass——设置Label关联的CSS类。

q Font——设置Label的字体属性。

q ForeColor——设置Label呈现内容的颜色。

q Style——为Label的样式赋值。

q ToolTip——设置Label的title属性（在微软IE中，title属性显示成浮动的提示）。

通常情况下，建议避免使用格式化属性而使用CSS来格式化Label控件的输出内容。代码清单2-2中的页面包含两个Label控件：第一个使用属性来格式化，第二个使用CSS来格式化（见图2-2）。

图2-2 格式化Label控件

代码清单2-2 FormatLabel.aspx

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

div

{

padding:10px;

}

.labelStyle

{

color:red;

background-color:yellow;

border:Solid 2px Red;

}

</style>

<title>Format Label</title>

</head>

<body>

<div>

<asp:Label

id="lblFirst"

Text="First Label"

ForeColor="Red"

BackColor="Yellow"

BorderStyle="Solid"

BorderWidth="2"

BorderColor="red"

Runat="server" />

<asp:Label

id="lblSecond"

Text="Second Label"

CssClass="labelStyle"

Runat="server" />

</div>

</form>

</body>

</html>

可以使用Label控件来标注一个HTML表单字段。Label控件拥有属性AssociatedControlID，可以设置此属性来指向表示表单字段的ASP.NET控件。

例如，代码清单2-3中的页面含有一个简单的表单，表单包含两个字段用于输入名和姓。Label控件用于标注这两个TextBox控件。

代码清单2-3 LabelForm.aspx

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Label Form</title>

</head>

<body>

<div>

<asp:Label

id="lblFirstName"

Text="First Name:"

AssociatedControlID="txtFirstName"

Runat="server" />

<br />

<asp:TextBox

id="txtFirstName"

Runat="server" />

<asp:Label

id="lblLastName"

Text="Last Name:"

AssociatedControlID="txtLastName"

Runat="server" />

<br />

<asp:TextBox

id="txtLastName"

Runat="server" />

</div>

</form>

</body>

</html>

为Label控件提供AssociatedControlID属性后，Label控件将呈现成HTML <label>标签而不是HTML <span>标签。在浏览器中选择查看源代码，可以看到代码清单2-3中的第一个Label控件在浏览器中生成下面这样的内容：

<label for="txtFirstName" id="lblFirstName">First Name:</label>

始终使用带有AssociatedControlID属性的Label控件来标注表单字段，对于残障人士能够访问网站很重要。如果有人使用的是像读屏器这样的辅助设备来与网站交互，AssociatedControlID属性将帮助辅助设备正确地把标签和表单字段关联起来。

使用AssociatedControlID属性的另一个好处是，当点击标签时，自动把表单焦点设置为关联的表单输入框。

准注解

Web标 WCAG 1.0和508辅助功能手册都要求使用<label for>标签来标注表单字段。更多信息请访问http://www.w3.org/wai和http://www.Section508.gov。

2.1.2 使用Literal控件

Literal控件类似于Label控件。Literal控件用于在浏览器中显示文本或HTML内容。但是，Literal控件并不把它的内容呈现在一个<span>标签中。

比如，代码清单2-4中页面在<head>标签中使用Literal控件动态地修改显示在浏览器标题栏中的标题，把当前的时间显示在Literal控件中（见图2-3）。

如果使用Label控件代替代码清单2-4中的Literal控件，未被解释的<span>标签将出现在浏览器标题栏中。

代码清单2-4 ShowLiteral.aspx

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

void Page_Load()

{

ltlTitle.Text = DateTime.Now.ToString("D");

}

</script>

<head>

</head>

<body>

<div>

<h1>Look in the title bar</h1>

</div>

</form>

</body>

</html>

图2-3 使用Literal控件修改浏览器标题

注解代码清单2-4中的页面使用格式化限定符（format specifier）来格式化日期，在把日期赋值给Label控件之前。格式化限定符D使日期格式化成长日期格式。可以使用一些标准的格式化限定符和ToString()方法来格式化日期、时间、货币数量和数字。可在Microsoft .NET Framework 2.0 SDK文档的索引中查找格式化限定符主题来查看这些格式化限定符的列表。

因为Literal控件内容并不包含在<span>标签中，Literal控件不支持任何由<span>标签支持的格式化属性。比如，Literal控件既不支持CssClass属性，也不支持BackColor属性。

Literal控件只支持一个Label控件不支持的属性——Mode属性。Mode属性用于编码HTML内容，它接受下列三个值：

q PassThrough——显示控件的内容而不进行任何的编码。

q Encode——在编码HTML内容后再显示控件的内容。

q Transform——在清除请求设备不支持的标记后再显示控件的内容。

比如，代码清单2-5中的页面包含了三个Literal控件，它们的Mode属性分别取三个可能的值（见图2-4）。