窗内网，免费看视频，轻松学编程 www.itzcn.com第第4章章 HTML控件控件窗内网，免费看视频，轻松学编程 www.itzcn.com内容摘要 HTML控件是ASP.NET所提供的在服务器端执行的组件，可以产生标准的HTML文件。一般说来，标准的HTML标签无法动态控制其属性、使用方法、接收事件，必须使用其他的程序语言来控制标签，这对于使用ASP程序设计来说很不方便，而且会使ASP程序比较杂乱。ASP.NET在这方面开发了新的技术，即将HTML标签对象化，使程序（如Visual Basic.NET、C#等）可以直接控制HTML标签，对象化后的HTML标签称之为HTML控件。窗内网，免费看视频，轻松学编程 www.itzcn.com学习目标了解HTML的语法掌握HTML控件的公共属性熟悉HTML控件的属性掌握HTML各控件的使用方法窗内网，免费看视频，轻松学编程 www.itzcn.com4.1 HTML控件简介控件简介 ASP.NET为动态网页程序设计带来了许多新的技术，这些技术其中之一就是将所有的HTML标记对象化，让程序可以直接控制；对象化之后的HTML标记称为HTML控件。 可以使用如C#或者VB.NET等语言来撰写控制HTML控件的程序，ASP.NET把HTML标记对象化，可以让网页对象的互动、程序的写作及维护变的更轻松容易，也让执行的效率明显的改善不少。窗内网，免费看视频，轻松学编程 www.itzcn.com4.1.1 HTML控件介绍控件介绍 控件是一个可重用的组件或者对象，有自己的属性和方法，可以响应事件。控件的基本属性定义自身的显示外观。在ASP.NET中，控件是组成ASP.NET页面内容的主要元素，增强和扩展了Web页面的功能和处理能力，规范了Web页面的代码，简化了Web页面的设计难度和设计过程。 根据控件定义及作用，ASP.NET中的控件可分为HTML控件，Web服务器控件，验证控件和用户自定义控件。 HTML控件又包括HTML常用服务器控件和与表单有关的控件。常用HTML控件和与表单有关的控件详见表4-1。 窗内网，免费看视频，轻松学编程 www.itzcn.com4.1.1 HTML控件介绍控件介绍HTML常用服务器控件常用服务器控件与表单有关的控件与表单有关的控件HTMLAnchorInput控件组HTMLFormSelect控件HTMLButtonTextArea控件HTMLInputButtonButton控件HTMLInputCheckBox无HTMLInputRadioButton无HTMLInputText无HTMLSelect无HTMLTextArea无表4-1 常用HTML控件与表单控件窗内网，免费看视频，轻松学编程 www.itzcn.com4.1.2 HTML控件的语法控件的语法 本节中的主题描述如何使用Visual Web Developer工具箱的HTML选项卡上的ASP.NET Web服务器控件。默认情况下，服务器无法使用ASP.NET网页上的HTML元素；这些元素被视为传递给浏览器的不透明文本。但是，通过将 HTML 元素转换成HTML服务器控件，可以将其公开为可以在基于服务器的代码中进行编程的元素。 HTML控件由HTML标记衍生而来，由于HTML标记的属性只能静态地设置，一般在程序执行过程中不能被修改，很不灵活。为了弥补这一不足。ASP.NET特别提供HTML控件，这种控件即允许在程序中设置其属性，也允许在程序的执行过程中动态地读取及修改其属性，从而可以产生动态的网页。窗内网，免费看视频，轻松学编程 www.itzcn.com4.1.2 HTML控件的语法控件的语法 下面来看一个HTML标记和HTML控件比较的例子 客户端 服务器端 比较这两个语句，可以看出声明一个HTML服务器按钮控件和声明一个HTML普通按钮控件有以下几点不同：u 服务器按钮控件用id属性代替了普通按钮控件的name属性。u 服务器按钮控件用 OnServerClick属性代替了普通按钮控件的OnClick属性。u 服务器按钮控件多用了一个属性runatserver。窗内网，免费看视频，轻松学编程 www.itzcn.com4.1.2 HTML控件的语法控件的语法 ID属性是标识服务器控件的惟一标志，通过ID可以像引用一个对象一样来直接在服务器端引用服务器控件。ID属性表示程序以本属性来控制对象，所以任何对象的名称不可重复，不管是否为同一种类。 用OnServerClick属性代替OnClick属性是为了表明响应按钮的单击事件是在服务器端进行处理，而不是客户端。多出的runat=server属性是说明该控件为服务器控件，这时区别HTML控件是服务器控件还是普通控件的惟一方法。窗内网，免费看视频，轻松学编程 www.itzcn.com4.2 HTML控件的公共属性控件的公共属性 所有的HTML控件都根据控件在表单中的用途可分为HTML输入控件和HTML容器控件。各个HTML控件都有自身的属性，并且各个HTML控件之间又存在着很多共同的属性。在HTML的所有控件中都包含Attributes、Disabled、Style、TagName、Visible等属性；HTML输入控件除共享所有HTML控件共享属性外还共享Name、Value和Type属性；HTML容器控件除共享所有HTML控件共享属性外还共享InnerHtml和Value属性。窗内网，免费看视频，轻松学编程 www.itzcn.com4.2.1 ATTRIBUTES属性属性 HtmlControl.Attributes属性位于命名空间System.Web.UI.HtmlControls下，用于获取在 ASP.NET页内的服务器控件标记上表示的所有属性（Attribute）名称和值对的集合。 使用该属性可以用编程方式访问HTML服务器控件的特性。所有Html服务器控件都将其特性存储在Control.ViewState中。语法如下： BrowsableAttribute(false) public AttributeCollection Attributes get; 窗内网，免费看视频，轻松学编程 www.itzcn.com4.2.2 DISABLED属性属性 HtmlControl.Disabled属性位于命名空间System.Web.UI.HtmlControls下，用于获取或者设置一个值，该值指示 HTML 服务器控件是否被禁用。语法如下： 属性值：如果该控件被禁用，则为true；否则为false。默认值为false。窗内网，免费看视频，轻松学编程 www.itzcn.com4.2.3 INNERHTML属性属性 HtmlControl.InnerHtml属性位于命名空间System.Web.UI.HtmlControls下，用于获取或者设置位于指定的HTML服务器控件的开始标记和结束标记之间的内容。 InnerHtml属性自动对进出HTML实体的特殊字符进行编码。HTML实体允许显示特殊字符（例如字符），浏览器通常会将这些字符解释为具有特殊含义。“”字符会被解释为标志的开头，并且不会在页面上显示。若要显示字符，将需要使用实体<。语法如下： 属性值：HTML服务器控件的开始标记和结束标记之间的HTML内容。窗内网，免费看视频，轻松学编程 www.itzcn.com4.2.4 INNERTEXT属性属性 HtmlContainerControl.InnerText属性位于命名空间System.Web.UI.HtmlControls下，用于获取或者设置指定HTML服务器控件的开始标记和结束标记之间的文本。与InnerHtml属性不同，InnerText属性不会对自动进出HTML实体的特殊字符进行编码。语法如下： 属性值：HTML服务器控件的开始标记和结束标记之间的文本。窗内网，免费看视频，轻松学编程 www.itzcn.com4.2.5 STYLE属性属性 HtmlControl.Style 属性属性位于命名空间System.Web.UI.HtmlControls下，用于获取应用于ASP.NET文件中指定的HTML服务器控件的所有级联样式表（CSS）属性（Property）的集合。语法如下： BrowsableAttribute(false) public CssStyleCollection Style get; 属性值：包含HTML服务器控件的样式属性 (Property)。 窗内网，免费看视频，轻松学编程 www.itzcn.com4.2.6 VALUE属性属性 HtmlInputControl.Value属性位于命名空间System.Web.UI.HtmlControls下，用于获取或者设置与HtmlInputControl控件关联的值。语法如下： 属性值：与HtmlInputControl控件关联的值。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3 HTML控件及其属性控件及其属性 默认情况下，ASP.NET文件中的HTML元素作为文本进行处理，并且不能在服务器端代码中引用这些元素。若要使这些元素能以编程方式进行访问，可以通过添加runat=server属性表明应将HTML元素作为服务器控件进行处理。还可以设置元素的id属性，使开发人员可以通过编程方式引用控件。然后可以通过设置属性（Attribute）来声明服务器控件实例上的属性（Property）参数和事件绑定。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.1 HTMLANCHOR控件控件 使用HtmlAnchor控件以编程方式控制HTML元素。使用HTML元素可以创建允许移到页上的其他位置或者其他网页的超链接。HtmlAnchor 控件必须使用带有开始和结束标记的正确格式。可以通过将文本放置在开始和结束标记之间来指定控件标题。此服务器控件通常用于动态修改元素的属性（Attribute）和属性（Property），显示来自数据源的超链接以及控制事件以动态生成HtmlAnchor控件。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.1 HTMLANCHOR控件控件 格式如下： 超级链接文字 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.2 HTMLFORM控件控件 使用HtmlForm控件可以对HTML元素进行编程。若要利用回发服务，则所有 Web窗体控件（无论HTML 件、Web控件、用户控件还是自定义控件）都必须嵌套在HtmlForm控件的格式良好的开始标记和结束标记之间。如果没有正确结束标记，ASP.NET将无法识别该元素。该元素将被忽略或者将发生编译错误，具体取决于该元素的构成方式。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.2 HTMLFORM控件控件格式如下: 其他控件 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.3 HTMLBUTTON控件控件 使用HtmlButton控件可以对HTML元素进行编程。可以为HtmlButton控件的ServerClick事件提供自定义代码，以指定在单击该控件时执行的操作。HtmlButton控件将JavaScript呈现到客户端浏览器。客户端浏览器必须启用了JavaScript，此控件才能正常运行。 HtmlButton控件必须写在窗体控件 之内，这是因为Button控件可以决定数据的上传，而只有被控件所包围起来的数据输入控件，其数据才会被上传。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.3 HTMLBUTTON控件控件 格式如下： 按钮上的文字、图形或者控件 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.4 HTMLTABLE、HTMLTABLEROW和和HTMLTABLECELL控件控件 若要创建表，首先应在页上的窗体中声明一个HtmlTable 控件。然后，将HtmlTableRow对象放置在HtmlTable控件的开始和结束标记之间（对于表中所需的每一行放置一个对象）。定义表中的行之后，声明位于每个HtmlTableRow对象的开始和结束标记之间的HtmlTableCell对象以创建该行的单元格。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.4 HTMLTABLE、HTMLTABLEROW和和HTMLTABLECELL控件控件1HtmlTable控件控件 使用HtmlTable控件对HTML元素进行编程。HtmlTable控件由一些行组成（由HtmlTableRow对象表示），这些行存储在表的Rows集合中。每行均由存储在行的Cells集合中的单元格（由HtmlTableCell对象表示）组成。HtmlTable控件允许自定义表的外观。通过设置BgColor、Border、BorderColor、Height和Width属性，可以分别指定表的背景色、边框宽度、边框颜色、表高度和表宽度。通过设置CellSpacing和CellPadding属性，还可以控制单元格间的间距以及单元格内容与单元格边框间的间距。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.4 HTMLTABLE、HTMLTABLEROW和和HTMLTABLECELL控件控件格式如下： 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.4 HTMLTABLE、HTMLTABLEROW和和HTMLTABLECELL控件控件 2HtmlTableRow 控件控件 使用HtmlTableRow 类对HTML元素进行编程。元素表示表中的行。HtmlTableRow类使可以控制表中各个独立行的外观。通过设置BgColor、BorderColor和Height 属性，可以分别控制行的背景色、边框颜色和高度。通过设置Align和VAlign属性，分别控制行中单元格内容的水平和垂直对齐方式。表中的每行都包含一个Cells集合，该集合对于该行中的每个单元格都包含一个HtmlTableCell。HtmlTableRow属性。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.4 HTMLTABLE、HTMLTABLEROW和和HTMLTABLECELL控件控件 格式如下： EnableViewState=False|True Id=被程序代码所控制的名称 runat=server cellcontent cellcontent cellcontent 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.4 HTMLTABLE、HTMLTABLEROW和和HTMLTABLECELL控件控件 3HtmlTableCell控件控件 使用HtmlTableCell类对和HTML元素进行编程。元素表示数据单元格，而元素表示标题单元格。HtmlTableCell类可以控制各个独立单元格的外观。通过设置BgColor、BorderColor、Height和Width属性，可以分别控制单元格的背景色、边框颜色、高度和宽度。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.4 HTMLTABLE、HTMLTABLEROW和和HTMLTABLECELL控件控件格式如下： CellContent 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.5 表单输入控件表单输入控件 1HTMLInputText控件控件 HtmlInputText控件用来控制和元素。在HTML中，这两个元素用来建立文本域和密码域。 格式如下： 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.5 表单输入控件表单输入控件 2HTMLInputImage控件控件 使用HtmlInputImage控件可以对HTML元素进行编程。可以将此控件与HtmlInputText、HtmlTextArea及其他控件一起使用以构造用户输入窗体。因为此控件是在服务器上运行的元素，所以其提供与HTML相同的按钮自定义。此控件可以替代不支持动态 HTML（DHTML）和HtmlButton控件的浏览器。窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.5 表单输入控件表单输入控件 格式如下： 窗内网，免费看视频，轻松学编程 www.itzcn.com4.3.5 表单输入控件表单输入控件 3HTMLInputFile控件控件 使用HtmlInputFile控件对HTML元素进行编程。可以使用HtmlInputFile控件设计页，使用户能够将二进制文件或者文本文件从浏览器上载到在Web服务器上指定的目录中。所有HTML3.2和更高版本的Web浏览器都允许进行文件上载。 格式如下：