Web服务器控件
《10.3Web服务器控件》
主题：
（1）Web服务器控件简述
Web服务器控件具有以下特性：
●功能丰富的对象模型，该模型具有类型安全编程功能。由于Web服务器控件是
https://www.360docs.net/doc/911483999.html,框架全新封装提供的新控件，因此其具有严格的类型安全检查。
●自动浏览器检测。Web服务器控件可以检测浏览器的功能，并为基本型和丰富型
(HTML 4.0或以上) 浏览器创建适当的输出。
●对于某些控件，可以使用模板来自定义控件的外观。
●对于某些控件，可以指定控件的事件是立即发送到服务器，还是先缓存然后在提交
窗体时引发。
●可将事件从嵌套控件（例如表中的按钮）传递到容器控件。
在设计时的“HTML”视图中，显示在页中的控件的格式如下：
（2）HTML服务器控件与Web服务器控件的区别
HTML服务器控件与Web服务器控件的区别：
（3）Web服务器控件的公共属性
1．System.Web.UI.WebControls.WebControl类的属性
System.Web.UI.WebControls.WebControl 类是System.Web.UI.WebControls 命名空间中的所有控件的基类。
●AccessKey属性：表示用于快速定位到Web 服务器控件的访问键。默认为空，表
示不设置该属性
●BackColor属性：表示Web 服务器控件的背景色，默认为空，表示不设置该属性。
●BorderColor属性：表示Web 控件的边框颜色，默认为空，表示不设置该属性。●BorderStyle属性：表示Web 服务器控件的边框样式，默认为NotSet，其取值为下
列值之一：
?NotSet 不设置边框样式。
?None 无边框
?Dotted 虚线边框。
?Dashed 点划线边框。
?Solid 实线边框。
?Double 双实线边框。
?Groove 用于凹陷边框外观的凹槽状边框。
?Ridge 用于凸起边框外观的突起边框。
?Inset 用于凹陷控件外观的内嵌边框。
?Outset 用于凸起控件外观的外嵌边框。
●BorderWidth属性：表示Web 服务器控件的边框宽度，默认为空，表示不设置该属
性。
●Enabled属性：表示是否启用Web 服务器控件。
●Font属性：表示Web 服务器控件关联的字体属性。
●ForeColor属性：表示Web 服务器控件的前景色（通常是文本颜色）。
●Height属性：表示Web 服务器控件的高度。
●Style属性：包含要在Web 服务器控件的外部标记上呈现的HTML 样式属性
●TabIndex属性：Web 服务器控件的选项卡索引。默认为0，表示不设置此属性
●ToolTip属性：表示当鼠标指针悬停在Web 服务器控件上时显示的文本。
●Width属性：表示Web 服务器控件的宽度。
2．其他的常用属性
●ID属性：继承自System.Web.UI.Control类，所有Web服务器控件都可以通过该属
性来唯一标识和引用。
●Text属性：所有接受用户输入，显示数据和提示数据的Web服务器控件都可以通
过Text属性来表示用于在控件上显示的文本，例如TextBox、Lablel、Button、CheckBox等控件。
●AutoPostBack属性：所有发送窗体或单击按钮时将其数据回传到服务器的Web控
件都具有AutoPostBack属性，该属性是布尔类型。表示当用户修改控件中的文本并使焦点离开该控件时，是否向服务器自动回送。True表示每当用户更改文本框中的文本并使焦点离开该控件时，都会向服务器自动回送，否则为false。默认为false。
●EnableViewState属性：继承自System.Web.UI.Control类，此属性用于定义控件的
视图状态或其包含的当前值在窗体发回到服务器之后是否保留在控件中。默认情
况，该属性设为True，即将窗体回发到服务器后，所有控件输入和选择的数据将
保留在控件中，如果不需要保留输入的值则应将此属性设为False。例如，首次打
开页面时，TextBox值为空，当输入数据并发回到服务器后，若该值为False，则将
清空TextBox的值，否则保留TextBox的输入值。
（4）Web服务器控件的布局模式
为了能够定位控件，有两种布局模式，在向Web页面添加控件之前，应该设置Document 的pageLayout的模式选项，这两种模式如下：
●网格布局模式（GridLayout）
此为默认的布局模式，网络布局通过绝对坐标来定位控件，控件可以准确放置在其被拖动到的位置上，并在页面上有绝对坐标。
●顺序布局模式（FlowLayot）
这种布局模式采用相对于页面上其他元素的方式来定位，在程序运行时动态添加元素，新控件将自动向下移动。
1.1.文本控件[20分钟]
引入：
主题：
（1）Label控件
Label控件是System.Web.UI.WebControls.WebControl类的子类，其通常用于显示各种提示信息。
1．Label控件的常用属性
Label控件是一个使用非常简单的控件，其自身的常用属性只有一个
●Text属性：用于表示Label 控件的文本内容
2．Label控件的方法
Label控件中的方法均从其父类继承而来，其自身仅一个构造函数，用于创建一个新的Label控件。
（2）TextBox控件
TextBox服务器控件也是System.Web.UI.WebControls.WebControl类的子类，它是使用户可以输入文本的输入控件。
1．TextBox控件的常用属性
●AutoPostBack属性：当用户修改TextBox 控件中的文本并使焦点离开该控件时，
是否都向服务器自动回送
●Text属性：指定TextBox 控件中显示的文本。
●TextMode 属性：用TextMode 属性指定TextBox 控件将显示为单行、多行还是
密码文本框，默认为TextBoxMode.SingleLine，其值应为下列值之一
?TextBoxMode.MultiLine 多行输入模式。
?TextBoxMode.Password 密码输入模式。
?TextBoxMode.SingleLine 单行输入模式。
●Columns 属性：文本框的显示宽度（以字符为单位）。默认值为0，表示未设置该
属性。
●Rows 属性：表示多行文本框中的行数。默认为0，表示显示单行文本框。
●Wrap 属性：指定多行TextBox 控件中显示的文本在到达控件末尾时，是否自动
换行显示。True表示自动换行，False表示不自动换行，默认为True。
●ReadOnly 属性：指定能否更改TextBox 控件的内容，True表示不可修改，False
表示可以修改，默认为False。
●MaxLength 属性：文本框中最多允许的字符数。默认值为0，表示未设置该属性。
2．TextBox控件的常用事件
TextBox的事件有TextChanged事件，用户输入信息后退出TextBox服务控件时，将触发该事件。TextChanged事件不会导致Web页面立刻被回传到服务器，只有当页面发回到服务器时，才会触发该事件。如果需要退出TextBox服务器控件立刻触发TextChanged事件，则应将TextBox控件的AutoPostBack属性设为True。
[示例讲解]
示例10.3.1 TextBox控件使用示例
主题：
控制权转移控件都可以实现将页面提交给服务器，主要包括以下4类：
●Button：标准按钮控件
●ImageButton：图像按钮控件
●LinkButton：显示超级链接样式的按钮控件
●HyperLink：超链接控件
（1）Button控件
通过设置CommandName 属性，command 按钮可以具有与该按钮关联的命令名，可以使开发人员在一个Web 页上创建多个Button 控件，并通过编码方式确定单击了哪个Button 控件。
[示例讲解]
示例10.3.2 Button控件使用示例。
（2）ImageButton控件
使用ImageButton 控件可以显示对鼠标单击作出响应的图像。当单击ImageButton 控件时，将同时引发Click 和Command 事件。使用OnClick 事件处理程序，可以以编程方式确定图像被单击的位置的坐标。然后，可以根据坐标值编写响应代码。注意原点(0, 0) 位于图像的左上角。使用OnCommand 事件处理程序使ImageButton 控件的行为与命令按钮一样。使用CommandName 属性可将命令名与该控件关联。它允许在同一Web 页上放置多个ImageButton 控件。然后，可以编程方式在OnCommand 事件处理程序中标识CommandName 属性的值，确定在单击每个ImageButton 控件时执行的相应操作。
CommandArgument 属性也可用于传递有关命令的附加信息。
（3）LinkButton控件
LinkButton控件的外观与HyperLink控件相同，但功能与Button控件相同，其常用属性和事件如下：
1．LinkButton控件的常用属性
●CommandName属性：与Button控件的CommandName属性类似。
●CommandArgument 属性：指定CommandName 属性的参数。
●Text 属性：指定在LinkButton控件中显示的文本信息
2．LinkButton控件的常用事件
LinkButton的常用事件与Button控件一样，均为Click事件和Command事件，其使用方式也相似。
（4）HyperLink控件
使用HyperLink 控件可以创建到其他Web 页面的链接。HyperLink 控件通常显示为Text 属性指定的文本。它也可以显示为ImageUrl 属性指定的图像。如果同时设置了Text 和ImageUrl 属性，则ImageUrl 属性优先。如果图像不可用，则显示Text 属性中的文本。在支持工具提示功能的浏览器中，Text 属性将变成工具提示。其常用属性和事件如下：1．HyperLink控件的常用属性
●ImageUrl属性：指定HyperLink控件显示的图像
●NavigateUrl 属性：单击HyperLink 控件时链接到的URL。
●Target属性：链接到的Web 页的目标窗口或框架。可以为自定义值，或下列特殊
值之一：
?Blank：将内容呈现在一个没有框架的新窗口中。
?_parent：将内容呈现在上一个框架集父级中。
?_self：将内容呈现在含焦点的框架中。
?_top：将内容呈现在没有框架的全窗口中
●Text 属性：指定在HyperLink控件中显示的文本信息。
2．HyperLink控件的常用事件
HyperLink控件主要用于定位到其他网页，没有公开的常用事件。
[示例讲解]
示例10.3.3转移控件使用示例
主题：
选择控件可以使用户从选项列表中选择一个或多个选项，https://www.360docs.net/doc/911483999.html,中提供了4类选择控件。
●CheckBox控件：用于确定是否选中选项。
●RadioButton控件：用于从多个选项列表中选择一个。
●DropDownList控件：允许用户从预定义列表中选择一项。
●ListBox控件：允许用户从预定义列表中选择一项或多项。
[示例讲解]
示例10.3.4选择控件的应用
主题：
https://www.360docs.net/doc/911483999.html,中有两种类型的容器控件，分别为Panel和PlaceHome控件。
主题：
https://www.360docs.net/doc/911483999.html,除了包含常用的WEB服务器控件之外，还提供了一些功能强大的专业控件，如AdRotator和Calendar控件。
[示例讲解]
示例10.3.5 AdRotator控件使用示例
示例10.3.6 Calendar控件的使用
2.小结 [3分钟]
本节学习了以下主要内容：
1．Web服务器控件简介
Web 服务器控件是设计侧重点不同的另一组控件。它们并不一对一映射到HTML 服务器控件，而是定义为抽象控件，Web服务器控件提供比HTML服务器控件更加丰富的属性、方法和事件，使得开发人员可以更简单的开发Web应用程序。
System.Web.UI.WebControls.WebControl 类是System.Web.UI.WebControls 命名空间中的所有控件的基类。其中定义了WEB服务器控件的常用属性、事件和方法。
在页面上有两种布局模式，分别是网格布局模式和顺序布局模式。
2．文本控件
文本控件主要两种类型，分别为Label和TextBox，其中Label控件一般用来显示不可编辑的文本信息，而TextBox一般是用来接受用户输入的控件。
3．控制权转移控件
控制权转移控件都可以实现将页面提交给服务器，主要包括以下4类：Button：标准按钮控件、ImageButton：图像按钮控件、LinkButton：显示超级链接样式的按钮控件、HyperLink：超链接控件。
4．选择控件
选择控件可以使用户从选项列表中选择一个或多个选项，https://www.360docs.net/doc/911483999.html,中提供了4类选择控件。CheckBox控件：用于确定是否选中选项。RadioButton控件：用于从多个选项列表中选择一个。DropDownList控件：允许用户从预定义列表中选择一项。ListBox控件：允许用户从预定义列表中选择一项或多项。
5．容器控件
https://www.360docs.net/doc/911483999.html,中有两种类型的容器控件，分别为Panel控件和PlaceHome控件
6．其他控件
https://www.360docs.net/doc/911483999.html,除了包含常用的WEB服务器控件之外，还提供了一些功能强大的专业控件，如AdRotator控件和Calendar控件。AdRotator Web 服务器控件能够显示广告条并在一系列广告条间循环显示。Calendar控件是专用控件中功能最丰富和最灵活的一个控件，可用于以
特定方式显示Web页面中日期，并提供用于控件日历外观的多种属性。
要求：
①页面顶端出现一个广告条，可随机在自定义的3条广告中进行选择播放
②带*号标识的为必填数据，开发人员应编码检测是否满足要求，如不满足则在页面上显示相应信息。
③“性别”为单选按钮，只能三选一
④日历控件默认情况下将隐藏，当点击[…]按钮显示日历控件，选择完毕后，重新隐藏，并将选择日期填入相应文本框中。
⑤“籍贯”要求当选择省份时，可自动显示该省份中的城市列表
⑥“爱好”为多选项，可在所给出的选项中选择任意个选项
⑦满足注册要求后，应在页面下方，显示注册成功信息。
答：
WEB服务器控件
WEB服务器控件 编写一个WEB控件至少要包含三个元素:ASP:XXX指明是哪一类控件,ID指明控件的标识符,Ruant 指明是在服务器端运行的。如:
MultiLine多行 Pasword密码输入 Columns 以字符为单位指明文本框的显示宽度 Rows 当TextMode为MultiLine时，指明文本框的行数 MaxLength 在单行文本方式下，文本框可以输入的字符数 Wrap 当TextMode为MultiLine时,是否自动换行，默认为TRUE ReadOnly 输入框为只读，默认为FALSE DataBind 将数据源绑定到被调用的服务器控件及其所有子控件上 TextChanged 当文本框内容发生变化时，触动。 文字控件案例一(5_3):制作登录界面 控件类型ID 属性设置说明 Label Label1 Text=用户名用于显示静态文本Label Label2 Text=密码用于显示静态文本Label LblMessage Text=””用于显示提示文本或登 录信息 TexBox TxtUserName TextMode=SingleLine 用于输入用户名TexBox TxtPassWord TextMode=Password 用于输入密码 Button BtnSumit Text=提交向服务器发送登录信息Button BtnRest Text=重置清除文本框内容 { TxtUserName.Text = ""; TxtPassWord.Text = ""; LblMessage.Text = ""; } protected void BtnSumit_Click(object sender, EventArgs e) { if ((TxtUserName.Text.Trim() != "") && (TxtPassWord.Text.Trim() != "")) { LblMessage.Text = "用户名:" + TxtUserName.Text + ":" + "密码" + TxtPassWord.Text; } else if (TxtUserName.Text.Trim() == "") { LblMessage.Text = "请输入用户名"; } else { LblMessage.Text = "请输入密码"; }
第8章Web服务器控件
第8章Web服务器控件 ?特点 会根据Client 端的状况产生一个或多个适当的HTML 服务器控件，它可以自动侦测Client 端浏览器的种类，并自动调整成适合浏览器的输出。 Web 服务器控件还拥有一个非常重要的功能，那就是支持数据绑定（Data Binding ）；这种能力可以和数据源连结，用来显示或修改数据源的数据。 它们提供了一些能够简化开发工作的特性，其中包括： 丰富而一致的对象模型：WebControl 基类实现了对所有控件通用的大量属性，这些属性包括ForeColor、BackColor、Font、Enabled 等。属性和方法的名称是经过精心挑选的，以提高在整个框架和该组控件中的一致性。通过这些组件实现的具有明确类型的对象模型将有助于减少编程错误。 对浏览器的自动检测：Web 控件能够自动检测客户机浏览器的功能，并相应地调整它们所提交的HTML，从而充分发挥浏览器的功能。 数据绑定：在Web 窗体页面中，可以对控件的任何属性进行数据绑定。此外，还有几种Web 控件可以用来提交数据源的内容。 在HTML 标记中，Web 控件会表示为具有命名空间的标记，即带有前缀的标记。前缀用于将标记映射到运行时组件的命名空间。标记的其余部分是运行时类自身的名称。与HTML 控件相似，这些标记也必须包含runat="server" 属性。下面是一个声明的示例： ＜asp:TextBox id="textBox1" runat="server" Text="基督山伯爵"＞ ＜/asp:TextBox＞ 介绍几种常见的web控件 4.2.1 Label Web控件 ?作用：用来显示文字。 ?语法：
Web服务器控件
《10.3Web服务器控件》 主题： （1）Web服务器控件简述 Web服务器控件具有以下特性： ●功能丰富的对象模型，该模型具有类型安全编程功能。由于Web服务器控件是 https://www.360docs.net/doc/911483999.html,框架全新封装提供的新控件，因此其具有严格的类型安全检查。 ●自动浏览器检测。Web服务器控件可以检测浏览器的功能，并为基本型和丰富型 (HTML 4.0或以上) 浏览器创建适当的输出。 ●对于某些控件，可以使用模板来自定义控件的外观。 ●对于某些控件，可以指定控件的事件是立即发送到服务器，还是先缓存然后在提交 窗体时引发。 ●可将事件从嵌套控件（例如表中的按钮）传递到容器控件。 在设计时的“HTML”视图中，显示在页中的控件的格式如下：
示不设置该属性 ●BackColor属性：表示Web 服务器控件的背景色，默认为空，表示不设置该属性。 ●BorderColor属性：表示Web 控件的边框颜色，默认为空，表示不设置该属性。●BorderStyle属性：表示Web 服务器控件的边框样式，默认为NotSet，其取值为下 列值之一： ?NotSet 不设置边框样式。 ?None 无边框 ?Dotted 虚线边框。 ?Dashed 点划线边框。 ?Solid 实线边框。 ?Double 双实线边框。 ?Groove 用于凹陷边框外观的凹槽状边框。 ?Ridge 用于凸起边框外观的突起边框。 ?Inset 用于凹陷控件外观的内嵌边框。 ?Outset 用于凸起控件外观的外嵌边框。 ●BorderWidth属性：表示Web 服务器控件的边框宽度，默认为空，表示不设置该属 性。 ●Enabled属性：表示是否启用Web 服务器控件。 ●Font属性：表示Web 服务器控件关联的字体属性。 ●ForeColor属性：表示Web 服务器控件的前景色（通常是文本颜色）。 ●Height属性：表示Web 服务器控件的高度。 ●Style属性：包含要在Web 服务器控件的外部标记上呈现的HTML 样式属性 ●TabIndex属性：Web 服务器控件的选项卡索引。默认为0，表示不设置此属性 ●ToolTip属性：表示当鼠标指针悬停在Web 服务器控件上时显示的文本。 ●Width属性：表示Web 服务器控件的宽度。 2．其他的常用属性 ●ID属性：继承自System.Web.UI.Control类，所有Web服务器控件都可以通过该属 性来唯一标识和引用。 ●Text属性：所有接受用户输入，显示数据和提示数据的Web服务器控件都可以通 过Text属性来表示用于在控件上显示的文本，例如TextBox、Lablel、Button、CheckBox等控件。 ●AutoPostBack属性：所有发送窗体或单击按钮时将其数据回传到服务器的Web控 件都具有AutoPostBack属性，该属性是布尔类型。表示当用户修改控件中的文本并使焦点离开该控件时，是否向服务器自动回送。True表示每当用户更改文本框中的文本并使焦点离开该控件时，都会向服务器自动回送，否则为false。默认为false。 ●EnableViewState属性：继承自System.Web.UI.Control类，此属性用于定义控件的
web服务器控件的取值和属性设置
实训2 web服务器控件的取值和属性设置 09计算机网络史丹 一、实训目的 1、掌握标签Label，文本框TextBox，单选按钮组RadioButtonList和多选按钮组CheckLBoxList，还有一个按钮Button控件的属性设置 2、学会如何获取上面这些控件的值 3、学会如何编写代码 二、实现功能及要求 练习添加新的Web窗体，设计一个用户注册界面，包括：姓名、账号、密码、性别、爱好、电子邮箱、说明；单击确定按钮后，在标签上输出用户的输入信息。 三、界面设计及后台代码 在https://www.360docs.net/doc/911483999.html,应用程序开发界面左边的工具栏中，拖出8个标签Label，5个文本框TextBox，1个单选按钮组RadioButtonList和1个多选按钮组CheckLBoxList，还有一个按钮Button。分别在8个标签属性框找到Text属性输入对应的内容，在button的属性框里找到Text的属性，然后编写相应的内容；在单选按钮组RadioButtonList和多选按钮组CheckLBoxList 有一个项目集合（Items Collection）属性，单击后会出现添加项目窗口并可设置项目的显示文本和相应的值，并在属性框里设置他们的排列方式为水平排列。 如下图所示： 然后，双击确定按钮，在按钮的Click事件中写入如下代码，又双击复选框组CheckBoxList，在其中编写如下代码： using System; using System.Collections; using https://www.360docs.net/doc/911483999.html,ponentModel; using System.Data; using System.Drawing;
web服务器控件和HTML控件的区别用法
谈谈HtmlControl与WebControl的区别以及各自应该什么时候用 Web控件和Html控件虽然好多功能相同并且长得很像 但是它们的内部实现机制是完全不一样的 Web控件要比Html控件执行效率要好 1. 使用起来也相当方便,举个简单的例子,例如Button的生成: Html控件是将庞大控件集合全部弄到页面中，用到哪个功能，就设置一下属性,如下: 这样会占用相当大的控件资源 Web控件是将集成式的拆解成单功能的：