第四章 Web服务器控件

BorderColor属性
BorderWidth属性
BorderStyle属性
4.4 基本控件-Button控件

使用Button控件可为用户提供向服务器发送网页
的能力。该控件会在服务器代码中触发一个事件，
可以处理该事件来响应回发。

包括三种按钮控件，每种按钮控件在网 页上显示的方式都不同，如下表4-1所列：
网站部署在Web服务器上，人们可以通过浏览 器来访问这个站点。客户端请求一个静态的HTML 页面时，服务器找到对应的文件直接将其发送给用 户端浏览器；

请求页面时，服务器将在文件系统中找 到并读取对应的页面，然后将页面中的服务器控件 转换成浏览器可以读取的HTML标记和一些脚本代 码，再将转换后的结果页面发送给用户。


Label控件

提供一种以编程方式设置Web窗体页中文本的方法。希望 在运行时更改页面中的文本时就可以使用Label控件。 当希望显示的内容不可以被用户编辑时，可以使用Label 控件。如果只是希望显示静态文字，并且文字内容不需要 改变，建议使用HTML显示。 示例代码： <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

使用服务器控件，可以大幅减少开发
Web应用程序所需编写的代码量，提高开发效率 和Web应用程序的性能。
三种超链接方法
（1）<a href=“”>新浪</a> （2）<a id=“anchor1” runat=“server” ></a> （3）<asp:HyperLink ID=" anchor2" runat="server" >HyperLink</asp:HyperLink>

注意：所有 HTML 服务器控件必须位于带有
runat=“server” 属性的 <form> 标签内。

runat=“server” 属性指示该表单应在服务器端进
行处理。同时指示其包括在内的控件可被服务
器脚本访问。

Web控件

Web 服务器控件是服务器可理解的特殊 标 签，是对HTML控件的扩充，它提供了更多的功能控 件，如日历控件、时间控件等，所有Web服务器控件 都包含在“<asp: ></asp: >”标记中；

服务器控件概述（3/6）

在页面上，服务器控件表现为一个标记，
如<asp:textbox…/>。此标记不是标准HTML元素，
如果出现在网页上，浏览器将无法理解。

当从Web服务器上请求一个页面时，这
些标记都将动态地转换为HTML元素，浏览器只会 接收到它能理解的HTML。

Button默认使用POST操作提交页面。LinkButton
和ImageButton控件不能直接支持POST操作。

使用这些按钮时，它们将客户端脚本添加到页面
以允许控件以编程方式提交页面。（因此
LinkButton和ImageButton要求在浏览器上启用 客户端脚本。）
（3）处理Button控件的客户端事件




注意：对Label标签，也可以显式HTML样式。
protected void Page_PreInit(object sender, EventArgs e)
{ Label1.Text = "Hello World<hr/><span style=\"color:red\">A Html Code</span>"; //输出 HTML Label1.Font.Size = FontUnit.XXLarge; //设置字体大小
4.3 Web控件概述

Web控件概述

对HTML控件的扩充，比HTML控件更为抽象。Web 控件包含在System.Web.UI.WebControls基类； ID属性 Width属性 TableIndex属性 Enabled属性 Height属性 AccessKey属性 Font属性Visible属性 BackColor属性
Button控件

Web页面中的普通按钮,submit按钮把Web页面提
交到服务器处理，没有从服务器返回的过程；

command类型按钮有一个相应command名（通过
CommandName属性设置该命令名字），当有多个
command类型按钮共享一个事件处理函数时，可 通过Command名字区分要出来哪个Button的事件。
服务器控件概述（4/6）
创建.aspx页面时，可以将任意的服务器控件放 到页面，请求服务器上该页面的浏览器将只会接 收到HTML和JavaScript脚本代码，如图4-1所示。

浏览器
http://server/page.aspx page.aspx
服务器
服务器端代码
客户端代码
图4-1 服务器端代码转换为客户端代码
三种输入文本框方法
（1）<input type=“text” name=“username”>
（2）<a id=“TextBox1” type=“text ”></>
（3）<asp:TextBox ID="TextBox1"
runat="server"></asp:TextBox>
服务器控件概述（1/6）

超链接控件通常使用的两个属性：

ImageUrl：要显式图像的URL。ห้องสมุดไป่ตู้
NavigateUrl：要跳转的URL。 动态跳转 超链接控件能够对控件进行编程，来按照用户的 意愿跳转到自己跳转的页面
TextBox（文本框）控件

在Web开发中，需要和用户进行交互，例如 用户注册、登录等。使用文本框制作高级的 文本编辑器用于HTML，以及文本的输入输出。 利用TextBox控件在Web窗体中输入信息（包 括文本、数字和日期）的方法。 通过该控件的TextMode属性设置可以设置单 行，多行和密码三种形式文本框。
表4-1 按钮控件的比较
控件
Button LinkButton ImageButton
说明
标准命令按钮，该按钮呈现为一个HTML input元素。 超链接，包含使窗体被发回服务器的客户端脚本。（可以使 用HyperLink 服务器控件创建真实的超链接。） 将图形呈现为按钮。这对于提供丰富的按钮外观非常有用。 ImageButton控件还提供有关图形内已单击位置的坐标信息
可以引发服务器事件，也可以引发客户端事件。 服务器事件在回发后发生，且这些事件在为页面 编写的服务器端代码中处理。客户端事件在客户 端脚本（如JavaScript）中处理，并在提交页面前 引发。 通过向按钮控件添加客户端事件，可 以执行一些任务（如在提交页之前显示确认对话 框以及可能取消提交）。


TextMode属性

TextBoxMode.SingleLine，显示一个单行文本框 （默认值）。 TextBoxMode.MultiLine，显示多行文本框（该文 本框将作为textarea元素呈现）。 TextBoxMode.Password，显示屏蔽用户输入的文 本框。通过使用Text属性可以获得TextBox控件中 显示的文本。

图1 投票界面
4.1 HTML标记、HTML控件和Web控件

HTML标记、HTML控件

HTML标记作为文本来进行处理，要想使标记可编程，
就需要向这些 HTML 元素添加 runat=“server” 属性。
该属性指示，此元素是一个服务器控件。同时要添加 id 属性来标识该服务器控件。

<asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton> Link类 型按钮 <br/> <asp:ImageButton ID="ImageButton1" runat="server" /> 图像类型按钮 <br/>
（1）按钮事件： 用户单击Button控件，会将该页发送到服务器。 这使得在基于服务器的代码中网页被处理，任何挂 起的事件被引发。这些按钮还可引发它们自己的 Click事件，可以为这些事件编写“事件处理程序”。
（2）按钮回发行为：
当用户单击按钮控件时，该页回发到服务器。默 认情况下，该页回发到其本身，在这里重新生成相 同的页面并处理该页上控件的事件处理程序。
第四章 Web服务器控件
本讲学习目标

掌握常见控件的使用方法
设计制作网络调查系统

本项目:网络调查系统。系统设计思路：首先用户设 置调查项生成调查问卷，对网上的浏览者进行调查， 网上浏览者对调查问卷进行相应的选择和回答后，提 交一个调查结果，调查结果在服务器端汇总，得出调 查结论。 系统将为使用者提供一个迅速、便捷的得到用户反馈 的方式，及时的了解用户对某些问题的真实态度，为 了解用户的反应以及为接下来的决策提供参考和依据。


文本控件其它属性

Text表示要显示的文本
MaxLength表示文本框的最大字符数。
AutoPostBack表示文本是否处理服务器端事件。 OnTextChanged事件表示当文本框中的文本发 生改变时处理的事件程序。