ASP.NET3.5核心编程学习笔记（5）：HTML控件

OStack程序员社区-中国程序员成长平台 › 门户 › 编程› ASP.NET›ASP.NET编程经验

原作者: [db:作者] 来自: [db:来源] 收藏邀请

　　代码片段：

　　经过ASP.NET运行库处理后，上述声明生成以下HTML代码：

　　注意：服务器端ID属性被展开为两个HTML属性：Name和ID。这是考虑到浏览器的兼容性。但在服务器端，控件实例的名称仅由ID指定。如果在一个服务器标签中同时指定了Name和ID，则Name的值会被自动重写为ID的值。

HTML控件的通性

　　所有预定义的HTML服务器控件继承于同一基类--System.Web.UI.HtmlControls.HtmlControl类。大多数HTML标签在.NET Framework中都有直接对应的类。少数没有量身定做的标签（如<iframe>、<hr>、<font>、<body>等）会通过HtmlGenericControl类进行呈现，通过泛化的属性（attribute）集合进行设置，而没有直接的属性（property）。

基类HtmlControl

　　HtmlControl类继承于Control类。下表列出了HTML控件特有的属性。

　　被禁用的HTML服务器控件仍是可见的，且总是以HTML代码的形式输出。如果其Visible属性被设为false，则不会为该控件生成HTML标记。

　　HTML的disabled属性只作用于HTML中的输入控件，对锚（anchor）这样的标签毫无影响。

HTML属性（attribute）的使用

　　每个HTML控件的属性（property）与HTML属性（attribute）间存在对应关系，赋给属性（property）的值会反映在HTML输出中。对那些在HTML中没有直接对应标签的控件，Attributes集合用于设置最终的HTML标签的属性（attribute）。该集合还用来设置那些无法直接通过控件接口设置的属性，如果需要还可自下定义HTML属性。Attributes集合的内容都按字符串处理。示例代码：


<script>
function Init()
{
    alert("Hello");
}
</script>

<script runat="server" language="C#">
void Page_Load(object sender, EventArgs e)
{
    theBody.Attributes["onload"] = "Init()";
}

<html>
<body runat="server" id="theBody"></body>
</html>

　　Attributes属性是一种特殊的类型--AttributeCollection类。尽管称为集合，但其内容并不能直接通过for...each语句进行迭代，因为它不支持IEnumerable接口。该类提供了几个特殊的方法，能够使用文本编写器（text writer）对象生成属性，也能添加或移除元素。有趣的是，如果添加名为Style属性，该类会自动将其内容转到Style集合中。

HTML控件的继承层次

　　大多数HTML控件可归结为两类：容器控件和输入控件。下图给出了HTML控件树层次：

HTML容器控件

　　容器控件的基类是HtmlContainerControl，这类标签的HTML元素必须带有结束标签。与HtmlControl类相比，容器控件还有两个属性：InnerHtml和InnerText。这两个属性用于对当前元素开始标签和结束标签间的文本内容进行读/写操作，标签本身不会被输出。注意，如果某控件内包含服务器控件，是不能获取前者的内部内容的。InnerText会以纯文本的形式获取或设置标签的内容，而InnerHtml获取或设置的内容相同，但格式为HTML。

　　下表列出了ASP.NET中定义的容器控件：

　　与HtmlButton不同，HtmlInputButton控件代表<input>标签的按钮变体。而HtmlButton控件代表HTML 4.0规范中的<button>标签。

　　服务器端窗体在ASP.NET应用程序中扮演着关键角色，因为它们是实现回发和确保状态维护的一种手段。基于这个原因，HtmlForm控件并非只是一个可以在服务器端进行编程的窗体元素。HtmlForm隐藏的Action属性，不能将其中的内容投递到另一个与所针对浏览器生成的HTML内容不同的页面上。

标头信息的管理

　　页面带有runat=server属性的<head>标签时将自动创建HtmlHead控件。注意，当将新页面添加到VS2008 Web项目时，该项设置为默认的。

　　Page类新引入的Header属性能返回页面的标头。如果没有定义<head>标签或缺少runat属性，则返回null。

　　HtmlHead控件实现了IPageHeader接口，它由3个集合属性（Metadata、LinkedStylesheet、Stylesheet）和一个字符串属性Title组成。Metadata属性是一个字典，用于收集标头中所有<meta>子标签。

　　代码：Header.Metadata.Add("CODE-LANGUAGE", "C#");

　　被转换为标记：<meta name="CODE-LANGUAGE" content="C#" />

　　为表达其他常用的元数据，可利用新加入的HtmlMeta控件，如下例：


void Page_Init(object sender, EventArgs e)
{
    HtmlMeta meta = new HtmlMeta();
    meta.HttpEquiv = "refresh";
    meta.Content = "10";
    ((Control)Header).Controls.Add(meta);
}

　　上述代码动态创建了一个meta标签，并在初始化阶段将其添加到页面head区段中。只要现有的meta标签带有runat属性，我们就可以编程方式来操纵它。

　　注意，必须将Header属性显式的转换为Control类型，因为Header属性是以IPageHeader为类型声明的。

导航到特定URL

HtmlAnchor类可以编程方式访问和配置<a>标签。

该类的HRef属性用于设置超链接的目标，并导航到特定位置。

Name属性对ASP.NET页面的区段命名，这样便可通过带有#前缀的HRefs，从同一页面的任何位置到达该处。

以下代码给出一个名为MoreInfo书签锚的定义：

通过以下超链接可抵达这个锚的位置：

Target属性用于识别加载被链接URL的目标窗口或框架。Target一般值为_self、_top、_blank和_parent，也可为其他页面特有框架的引用名称。该功能很大程序上依赖于浏览器。

Title属性指定当鼠标悬停在锚的区域上时显示的文本。

HtmlAnchor控件除用于导航到另一页面外，还可通过ServerClick事件将页面回发。示例代码：

<a runat=”server” onclick=”Run()” onserverclick=”DoSomething”>Click</a>

onclick属性定义了使用JavaScript编写的客户端事件处理程序，而onserverclick属性指向一段服务器端代码。

HtmlSelect控件

HtmlSelect控件代表选项列表，可选一项或多项。

Size属性定义了显示在控件中的行数量。

Multiple属性指定能否对该控件进行多选。

在内部，各选项被组织在Items集合中，每个元素代表一个ListItem对象。ListItem没有在HtmlControls命名空间中定义，而位于WebControls命名空间中。

默认情况下，HtmlSelect控件表现为下拉列表。如果允许多选或行数大于1，该控件会表现为列表框。

DataSource属性用于设置数据源，它可以是任何实现IEnumerable接口的.NET对象。如果数据源（如DataSet对象）包含多个可绑定表，可使用DataMember属性选择其中一个。DataTextField和DataValueField分别用于将列表项的Text和Value属性绑定到数据源相应列上。

HtmlTextArea控件

HtmlTextArea控件对应的HTML元素为<textarea>。

Rows和Cols属性指定文本框的行数和列数。

Value属性可向控件的显示区域添加文本。

ServerChange事件：当页面回发时，如果控件文本框中内容被更改，将触发该事件。

该控件实现了IPostBackDataHandler接口，可通过重写该接口的RaisePostDataChangedEvent方法引发自定义事件。

为确定ServerChange事件是否发生，必须对两次回发间文本内容进行跟踪，这种信息存储在视图状态中。如果关闭宿主页面或控件的视图状态，ServerChange事件就不会被触发了。

HTML输入控件

所有输入控件类都派生自HtmlInputControl类。该类是抽象类，定义了所有输入控件所需的公共编程接口。

Name属性返回控件的名称，该属性虽被标为可读/写，但实际上只充当只读属性。get访问器返回该控件的UniqueID属性，set访问器是空的。

Type属性反映HTML输入元素的type属性，该属性是只读的。

Value属性是可读/写属性，代表输入字段的内容。

HtmlInputButton控件

ServerClick事件：按钮被单击后在服务器端触发的事件。

该控件会自动在HTML的onclick属性中添加用于回发的脚本代码。这样，任何单击操作都会使页面回发，并执行相应代码。

示例：

相应的HTML代码为：

__doPostBack脚本函数是一段由ASP.NET生成的标准代码，目的是实现回发。如果按钮的类型被设置为Submit（即总是引起回发），便不会生成客户端脚本，也不会设置onclick属性。

ASP.NET 2.0及更高版本中，添加了为生成提交和复位按钮更具体的HtmlInputSubmit和HtmlInputReset控件。

CausesValidation属性：布尔类型，指示在按钮被单击后，是否对输入字段进行验证，默认为true。如果无需验证，可设为false将其关闭

HtmlInputFile控件

该控件是一种文件上传工具。为使用该控件，应确保服务器窗体的Enctype属性为multipart/form-data。但从ASP.NET 2.0版开始，在HtmlInputFile控件被呈现为标记前，EncType会被自动设置。

在服务器端，文件会由HttpPostedFile类型对象承载。

示例代码：


<%@ Page Language=”C#” %>
<%@ Import Namespace=”System.IO” %>
<script runat=”server”>
void UploadButton_Click(object sender, EventArgs e)
        {
if(FileUpload1.PostedFile != null)
              {
                FileUpload1.PostedFile.SaveAs(@”C:\tmp\” + Path.GetFileName(FileUpload1.Value);
              }
        }
</script>
<html>
<head runat=”server”>
<title>File Upload</title>
</head>
<body>
<form runat=”server”>
<input type=”file” id=”FileUpload1” runat=”server” />
<input runat=”server” id=”UploadButton” type=”submit” value=”Upload” 

                     onserverclick=”UploadButton_Click” />
</form>
</body>
</html>

可使用HttpPostedFile对象的InputStream属性在保存或处理读取被投递的数据。

HttpInputFile控件的Accept属性可限制上传的文件类型。

在使用SaveAs方法时，一定要指定输出文件的完整路径。此外，应确保ASP.NET所使用的帐户对所要存储文件的目录有写入权限。

ASP.NET对单次上传的数据量做了一定限制。配置文件中的<httpRuntime>区段的maxRequestLength属性规定了允许上传文件的最大大小。默认情况下，文件大小超过4MB，浏览器就会显示错误。

HtmlImage控件

HtmlImage类对应于<img>标记。仅当页面包含设置了runat属性的<img>标签时，HtmlImage的实例才被创建。

若要以编程文件控制图像，改变其源文件、宽/高或与页面其他元素的对齐方式，则可使用该控件。

Literal控件

Literal控件是特殊的服务器控件类型，ASP.NET遇到不需要服务器端处理的纯文本时才创建并使用它。一般来讲，ASP.NET页面上下文中出现的一切都会被视作控件。如果某个标签包含runat=”server”属性，ASP.NET会创建特定类的实例。如果未指定runat属性，该文本会被编译为LiteralControl对象。Literal控件是简单文本的存储器，通过与其他服务器控件定义的一致的编程接口，能将其添加到页面中，也能将其移除。