ASP.NET - TextBox Web 服务器控件概述

 

      TextBox Web 服务器控件为用户提供了一种向 ASP.NET 网页中键入信息(包括文本、数字和日期)的方法。

 

一、背景

TextBox 服务器控件是让用户输入文本的输入控件。默认情况下,该控件的 TextMode 属性设置为 TextBoxMode.SingleLine,这将显示一个单行文本框。但可以将 TextMode 属性设置为 TextBoxMode.MultiLine,以显示多行文本框(该文本框将作为 textarea 元素呈现)。也可以将 TextMode 属性更改为 TextBoxMode.Password,以显示屏蔽用户输入的文本框。通过使用 Text 属性可以获得 TextBox 控件中显示的文本。

 

1TextBox 事件

当用户离开 TextBox 控件时,该控件将引发 TextChanged 事件。默认情况下,并不立即引发该事件;而是当提交页时才在服务器上引发。但您可以指定 TextBox 控件在用户离开该字段之后马上将页面提交给服务器。

TextBox Web 服务器控件并非每当用户输入一个键击就引发事件,而是仅当用户离开该控件时才引发事件。可以让 TextBox 控件引发您在客户端脚本中处理的客户端事件,这可能有助于响应单个键击。有关详细信息,请参见 ASP.NET 网页中的客户端脚本。

 

2TextBox 标题

可以使用 Label 控件为 TextBox 控件创建标题。该标题可以定义用户按下便可导航 TextBox 控件的访问键。

 

3、文本框中的自动完成

许多浏览器都支持自动完成功能,该功能可帮助用户根据以前输入的值向文本框中填充信息。自动完成的精确行为取决于浏览器。通常,浏览器根据文本框的 name 属性存储值;任何同名的文本框(即使是在不同页上)都将为用户提供相同的值。有些浏览器还支持 vCard 架构,该架构允许用户使用预定义的名、姓、电话号码、电子邮件地址等值在浏览器中创建配置文件。

TextBox 控件支持 AutoCompleteType 属性,该属性为您提供了以下用于控制浏览器如何使用自动完成的选项:

·禁用自动完成。如果您不想让浏览器为文本框提供自动完成功能,则可将其禁用。

·指定 vCard 值以用作字段的自动完成值。浏览器必须支持 vCard 架构。

 

二、如何:获取和设置 TextBox Web 服务器控件中的值

      下面的代码示例显示如何读取一个名为 TextBox1 TextBox 控件的值,并使用该值来设置另一个控件 TextBox2 的值。

protected void Button1_Click(object sender, System.EventArgs e)

{

   TextBox2.Text = Server.HtmlEncode(TextBox1.Text);

}

 

三、如何:响应 TextBox Web 服务器控件中的更改

      TextBox 控件的 TextChanged 事件创建一个事件处理程序。

默认情况下,TextChanged 事件并不马上导致向服务器发送 Web 窗体页。而是当下次发送窗体时在服务器代码中引发此事件。若要使 TextChanged 事件引发即时发送,请将 TextBox 控件的 AutoPostBack 属性设置为 true

protected void TextBox1_TextChanged(object sender, EventArgs e)

{

   Label1.Text = Server.HtmlEncode(TextBox1.Text);

}

 

四、如何:设置 TextBox Web 服务器控件以输入密码

1、将 TextBox 控件的 TextMode 属性设置为 Password。在代码中,使用 TextBoxMode 枚举设置文本模式。

2、通过将控件的 Width 属性设置为以像素为单位的值,或将其 Columns 属性设置为要显示的字符数,来设置控件的大小。如果同时设置了这两个属性,则 Width 优先。

      说明: Width 属性在不支持级联样式表 (CSS) 样式的浏览器中无效。

      3、或者,您可以通过设置控件的 MaxLength 属性来限制允许用户输入的字符数。如果用户输入超过这一字符数,控件就停止接受多出的字符。

说明: 您可能不想设置 MaxLength 属性,因为它可能被试图猜测密码的未经授权的用户所利用。

 

五、如何:为 TextBox Web 服务器控件指定多行输入

      多行 TextBox 控件允许用户在支持自动换行和水平及垂直滚动的框中键入信息。

      1、将 TextBox 控件的 TextMode 属性设置为 Multiline。在代码中,使用 TextMode 枚举设置文本模式。

 

2、通过设置下列属性来设置控件的大小: Width 设置为以像素为单位的值,或将 Columns 设置为要显示的字符数。将 Height 设置为以像素为单位的值,或将 Rows 设置为行数。

说明: Height Width 属性不适用于不支持级联样式表 (CSS) 样式的浏览器。

      设置这些属性并不会限制用户可以输入的字符数或行数,而只是限制了所显示的字符数或行数。控件将始终显示垂直滚动条。Height Width 优先于 Rows Columns

      说明: 默认情况下,多行 TextBox 控件将包含一个垂直滚动条。若要隐藏该滚动条,请包括样式属性 overflow: hidden。例如,在 HTML 视图中,控件的声明性语法会是下面这样:

<asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 56px; OVERFLOW: hidden; POSITION: absolute; TOP: 72px" runat="server" TextMode="MultiLine"></asp:TextBox>

 

      3、通过设置控件的 Wrap 属性来设置自动换行行为。如果设置为 true,文本将会自动换行(不会嵌入回车/换行符)。如果设置为 false,则文本不换行,用户必须按 Enter 来开始新行,这将嵌入回车/换行符。将 Wrap 属性设置为 false 将使控件显示水平滚动条。

说明: MaxLength 属性在多行文本框中不起作用。

 

六、TextBox

      TextBox 服务器控件是使用户可以输入文本的输入控件。默认情况下,该控件的 TextMode 属性设置为 TextBoxMode.SingleLine,将显示一个单行文本框。然而,通过将 TextMode 属性值分别改为 TextBoxMode.MultiLine TextBoxMode.Password,您也可以使用 TextBox 控件显示多行文本框或显示屏蔽用户输入的文本框。使用 Text 属性,可以指定或确定 TextBox 控件中显示的文本。

TextBox 控件包含多个属性,用于控制该控件的外观。文本框的显示宽度(以字符为单位)由它的 Columns 属性确定。如果 TextBox 控件是多行文本框,则它显示的行数由 Rows 属性确定。要在 TextBox 控件中显示换行文本,请将 Wrap 属性设置为 true

还可以设置一些属性来指定如何将数据输入到 TextBox 控件中。要防止控件中显示的文本被修改,请将 ReadOnly 属性设置为 true。如果想限定用户只能输入指定数目的字符,请设置 MaxLength 属性。

 

示例

下面的代码示例演示如何使用 TextBox 控件来获取用户输入。当用户单击“添加”按钮时,将显示文本框中输入值之和。

安全说明: 此示例有一个接受用户输入的文本框,这是一个潜在的安全威胁。默认情况下,ASP.NET 网页验证用户输入是否不包括脚本或 HTML 元素。

<%@ Page Language="C#" AutoEventWireup="True" %>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html  >

 

<head>

    <title> TextBox Example </title>

<script runat="server">

 

      protected void AddButton_Click(Object sender, EventArgs e)

      {

         int Answer;

 

         Answer = Convert.ToInt32(Value1.Text) + Convert.ToInt32(Value2.Text);

 

         AnswerMessage.Text = Answer.ToString();

 

      }

 

   </script>

 

</head>

 

<body>

 

   <form id="form1" runat="server">

 

      <h3> TextBox Example </h3>

 

      <table>

 

         <tr>

 

            <td colspan="5">

 

               Enter integer values into the text boxes. <br />

               Click the Add button to add the two values. <br />

               Click the Reset button to reset the text boxes.

 

            </td>

 

         </tr>

 

         <tr>

 

            <td colspan="5">

 

               &nbsp;

 

            </td>

 

         </tr>

 

         <tr align="center">

 

            <td>

 

               <asp:TextBox ID="Value1"

                    Columns="2"

                    MaxLength="3"

                    Text="1"

                    runat="server"/>

 

            </td>

 

            <td>

 

               +

 

            </td>

 

            <td>

 

               <asp:TextBox ID="Value2"

                    Columns="2"

                    MaxLength="3"

                    Text="1"

                    runat="server"/>

 

            </td>

 

            <td>

 

               =

 

            </td>

 

            <td>

 

               <asp:Label ID="AnswerMessage"

                    runat="server"/>

 

            </td>

 

         </tr>

 

         <tr>

 

            <td colspan="2">

 

               <asp:RequiredFieldValidator

                    ID="Value1RequiredValidator"

                    ControlToValidate="Value1"

                    ErrorMessage="Please enter a value.<br />"

                    Display="Dynamic"

                    runat="server"/>

 

               <asp:RangeValidator

                    ID="Value1RangeValidator"

                    ControlToValidate="Value1"

                    Type="Integer"

                    MinimumValue="1"

                    MaximumValue="100"

                    ErrorMessage="Please enter an integer <br /> between than 1 and 100.<br />"

                    Display="Dynamic"

                    runat="server"/>

 

            </td>

 

            <td colspan="2">

 

               <asp:RequiredFieldValidator

                    ID="Value2RequiredValidator"

                    ControlToValidate="Value2"

                    ErrorMessage="Please enter a value.<br />"

                    Display="Dynamic"

                    runat="server"/>

 

               <asp:RangeValidator

                    ID="Value2RangeValidator"

                    ControlToValidate="Value2"

                    Type="Integer"

                    MinimumValue="1"

                    MaximumValue="100"

                    ErrorMessage="Please enter an integer <br /> between than 1 and 100.<br />"

                    Display="Dynamic"

                    runat="server"/>

 

            </td>

 

            <td>

 

               &nbsp

 

            </td>

 

         </tr>

 

         <tr align="center">

 

            <td colspan="4">

 

               <asp:Button ID="AddButton"

                    Text="Add"

                    OnClick="AddButton_Click"

                    runat="server"/>

 

            </td>

 

            <td>

 

               &nbsp;

 

            </td>

 

         </tr>

 

      </table>

 

   </form>

 

</body>

</html>

 

七、TextBoxMode 枚举

成员

 

成员名称

说明

 

SingleLine

表示单行输入模式。

 

MultiLine

表示多行输入模式。

 

Password

表示密码输入模式。

TextBoxMode 枚举表示 TextBox 控件的不同显示选项。

·SingleLine 模式将 TextBox 控件显示为单行。如果用户输入的文本超过了 TextBox 控件的物理大小,则文本将沿水平方向滚动。

·MultiLine 模式基于 Rows 属性显示 TextBox 的高度,并且允许数据项位于多行上。如果 Wrap 属性设置为 true,则文本将自动换行。如果用户输入的文本超过了 TextBox 的物理大小,则文本将相应地滚动,并且将出现滚动条。

Password 模式的行为类似于 SingleLine 模式,但在 TextBox 控件中输入的所有字符都会被屏蔽,不保存在视图状态中。

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值