清华电脑学堂：ASP.NET 4.5网站开发与应用实践教程
上QQ阅读APP看书，第一时间看更新
上一章目录下一章

3.2 文本控件

文本控件是指文本相关的控件，包括文本的显示和输出。本节主要介绍文本控件的适用范围和使用方法。

3.2.1 Label控件

Label的英文含义是标签，其在页面中的作用正如一个可以被写入文字的标签。Label控件也称作标签控件，其在页面中的显示是一行（或一段）文字。

Label控件的添加可以在工具箱中进行拖拉，其在工具箱中的符号为。该控件的Text属性值，是页面中所显示的文本。

该属性的值可以是文本，也可以是浏览器能够识别的页面元素，如在文本当中含有<br/>元素，则文本的显示会有换行。

Label提供了一种以编程方式设置文本的方法，可以在后台对文字的内容和样式进行设置。

Label控件中的文本可以是静态的和动态的，静态的情况下在页面固定位置显示文本；动态情况下可以绑定到数据源。声明Label控件有两种语法形式，如下所示。

        <asp:Label ID= "lblName" runat = "server" Text = "文本内容"></asp:Label>
        //或者
        <asp:Label ID= "lblName" runat = "server">文本内容</asp:Label>

直接从工具箱中拖出的Label控件，其代码如下所示。

        <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

除了runat="server"属性以外，Label控件默认含有ID和Text属性。其中，ID用来设置控件的唯一标识列；Text属性向用户显示文本信息，该属性的值可以是HTML格式的内容。

ID属性是不可缺少的身份识别，若同时存在多个Label控件，该值是不可缺少的；而Label控件的作用即为显示文本信息，因此Text属性的默认值将使其失去意义。

Label控件的Text属性可以设置为任何字符串（包括包含标记的字符串），如果字符串包含标记，Label控件将解释标记。Label控件还提供了一系列的样式属性，以设置其文本的展示样式，如字体的颜色、字体背景色大小、下划线、是否加粗等，如设置一个红色加粗的标签，代码如下。

        <asp:Label  ID="Label1"  runat="server"  Text="Label"  Font-Bold="True"
        ForeColor="Red"></asp:Label>

3.2.2 Literal控件

Literal控件的作用同样是在页面中显示文本，但Literal控件不允许对所显示的文本应用样式。

在工具箱中，Literal控件的符号为。Literal控件与Label控件一样用于显示文本，但Literal控件可以在浏览器中进行动态的添加，通常将其添加到指定容器内。

Literal控件与Label控件最大的区别在于：Literal控件不能向文本中添加任何的HTML元素。因此，Literal控件不支持包括位置特性在内的任何样式特性。但是，该控件允许对其内容进行编码。

通常情况下，如果开发人员希望文本和控件直接呈现在页面中而不使用任何附加标记时可以使用Literal控件。除了ID和Text属性外，Literal控件最常用的属性是Mode，该属性用于指定控件对所添加的标记的处理方式。其值如下所示。

（1）Transform：将对添加到控件中的任何标记进行转换，以适应请求浏览器的协议。如果向使用HTML外的其他协议的移动设备呈现内容，设置该值时非常有用。该值为Mode属性的默认值。

（2）PassThrough：添加到控件中的任何标记都将按原样呈现在浏览器中。

（3）Encode：使用HtmlEncode()方法对添加到控件中的任何标记进行编码，这会将HTML编码转换为其文本表示形式。例如，<b>将呈现为&lt; b&gt;。当开发人员希望浏览器显示而不解释标记时，该方式将非常有用。

如向页面中添加Literal控件，使其ID为“Literal”；显示文本为“动态添加”；将控件添加在form1中，使用代码如下。

        protected void Page_Load(object sender, EventArgs e)
        {
            Literal liter = new Literal();          //通过Literal创建liter对象
            liter.ID = "Literal";                   //设置ID属性
            liter.Text = "动态添加";                  //设置Text属性
            form1.Controls.Add(liter);               //将liter添加到表单中
        }

上述代码中，form1作为一个容器，接收Literal控件的添加。但这个添加过程无法设置Literal控件的添加位置。

3.2.3 TextBox控件

Label控件和Literal控件属于文本显示控件，而TextBox控件属于文本输入控件。这三种控件都有Text属性，该属性可设置Label和Literal控件的显示文本，也可以获取用户在TextBox上面输入的文本。

TextBox控件又称作文本框控件，其在工具箱中的符号为。TextBox控件提供一个输入框，供用户输入。文本框中输入的值即为该控件的Text属性值，可在后台通过控件的ID进行获取。接下来对控件的属性、事件和自动完成功能进行介绍。

1.TextBox控件的常用属性

TextBox控件是一种基本控件，它为用户提供了一种在Web窗体中输入信息（包括文本、数字和日期等）的方法。该控件的常用属性如表3-2所示。

表3-2 TextBox控件的常用属性

TextBox控件可以通过TextMode属性设置出单行、多行和密码三种形式的文本框。TextMode属性的可取值如下。

（1）SingleLine：默认值，单行输入模式。用户只能在一行中输入信息，还可以限制控件接受的字符数。

（2）Password：密码框，用户输入的内容将以其他字符代替（如*和●等），以隐藏真实信息。

（3）Multiline：多行输入模式，用户在显示多行并允许换行的框中输入信息。

开发人员可以通过Text属性获取或设置TextBox控件中的值，例如，获取控件ID为TextBox1的属性值并将其赋予字符串变量name，代码如下。

        string name =TextBox1.Text;

2.TextBox控件的事件

TextBox控件最常用的事件是TextChanged事件，当用户离开TextBox控件时就会引发该事件。默认情况下并不会立即引发该事件，而是当下次发送窗体时在服务器代码中引发此事件。控制这一事件的属性是AutoPostBack，该属性的默认值为false。将该属性的值设置为true，用户离开TextBox控件后将页面提交给服务器。

例如，为TextBox控件添加TextChanged事件，当用户离开TextBox1文本框后触发该事件将值赋予Label控件进行显示，代码如下。

        protected void TextBox1_TextChanged(object sender, EventArgs e)
        {
          Label1.Text = Server.HtmlEncode(TextBox1.Text);
        }

3.TextBox控件的自动完成功能

许多浏览器都支持自动完成功能，该功能可以帮助用户根据以前输入的值向文本框中填充信息。自动完成的精确行为取决于浏览器，通常浏览器根据文本框的name特性存储值；任何同名的文本框（即使是在不同页上）都将为用户提供相同的值。

有些浏览器还支持vCard架构，该架构允许用户使用预定义的名、姓、电话号码和电子邮件地址等值在浏览器中创建配置文件。

TextBox控件支持AutoCompleteType属性，该属性为用户提供了用于控制浏览器如何使用自动完成的选项。

3.2.4 HyperLink控件

在文本的显示中，还有一个特殊的控件HyperLink控件。HyperLink控件用于显示文本和图片的超链接，其在工具箱中的符号为。

与大多数Web服务器控件不同，当用户单击HyperLink控件时并不会在服务器代码中引发事件，该控件只执行导航操作。HyperLink控件有以下两个优点。

（1）可以在服务器代码中设置链接属性，例如，开发人员可以根据页面中的条件动态更改链接文本或目标页。

（2）可以使用数据绑定来指定链接的目标URL（以及必要时与链接一起传递的参数）。

除了ID属性和Text属性外，HyperLink控件还有如下几个常用属性。

（1）ImageUrl：获取或设置该控件显示的图像的路径。

（2）NavigateUrl：获取或设置单击控件时链接到的URL。

（3）Target：获取或设置单击控件时显示链接到的网页内容的目标窗口或框架。该属性的值包括_blank、_self、_top、_parent和_search。

使用HyperLink控件可单击页面中的文字或图片，打开新的页面，其功能相当于一个链接。如果同时设置了LinkButton控件的ImageUrl和Text属性的值，则ImageUrl属性优先。

【范例1】

结合本节内容，使用Label控件显示《早发白帝城》的诗词内容；使用Literal控件显示“诗词的作者是”字样；使用文本框供用户输入诗词作者；添加按钮，在单击按钮之后向页面添加Literal控件显示诗词的作者；添加HyperLink控件指向下一条问题所在的页面，步骤如下。

（1）创建页面并添加Table元素，将需要使用的控件依次放在Table中的每一行，代码省略。向Table中添加Label控件显示《早发白帝城》的诗词内容，要求每两句之后添加换行标记，代码如下。

        <asp:Label ID="Label1" runat="server" Text="Label">
        朝辞白帝彩云间，千里江陵一日还。<br/>
        两岸猿声啼不住，轻舟已过万重山。<br/>
        </asp:Label>

（2）向Table中添加Literal控件显示“诗词的作者是”字样；添加文本框供用户输入诗词作者，代码如下。

        <asp:Literal ID="Literal1" runat="server">诗词的作者是：</asp:Literal>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

（3）向Table中添加Panel容器和按钮控件，为按钮控件添加按钮单击事件，代码如下。

        <asp:Panel ID="Panel1" runat="server">
            <asp:Button   ID="Button1"   runat="server"   Text="  答  案  :  "
    OnClick="Button1_Click1" />
        </asp:Panel>

（4）向Table中添加HyperLink控件用于打开下一条问题所在的页面，将新页面的地址设置为“WebForm1.aspx”，代码如下。

        <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl=" WebForm1.
        aspx ">下一条</asp:HyperLink>

（5）定义按钮的单击事件，向Panel容器中添加Literal控件显示诗词的作者，代码如下。

        Literal liter = new Literal();
        liter.ID = "literText";
        liter.Text = "李白";
        Panel1.Controls.Add(liter);

（6）运行页面，其效果如图3-1所示。单击【答案】按钮，在页面中多了“李白”两个字，其效果如图3-2所示。

图3-1 文本控件显示效果

图3-2 向页面中添加Literal

上一章目录下一章