ASP.NET Web Forms – TextBox 控件

ASP.NET Web Forms – TextBox 控件终极使用大全（2025 企业实战版）
写过 1000+ 个后台页面的老程序员把所有血泪经验都给你整理好了，直接复制就能用！

一、TextBox 所有形态（10 种写法，一网打尽）

<!-- 1. 普通单行文本框（最常用）-->
<asp:TextBox ID="txtUserName" runat="server" 
     CssClass="form-control" 
     placeholder="请输入用户名" 
     MaxLength="50" />

<!-- 2. 密码框 -->
<asp:TextBox ID="txtPassword" runat="server" 
     TextMode="Password" 
     CssClass="form-control" 
     placeholder="请输入密码" />

<!-- 3. 多行文本框（TextMode=MultiLine）-->
<asp:TextBox ID="txtRemark" runat="server" 
     TextMode="MultiLine" 
     Rows="5" 
     CssClass="form-control" 
     placeholder="请输入备注信息" />

<!-- 4. 数字输入框（HTML5）-->
<asp:TextBox ID="txtAge" runat="server" 
     TextMode="Number" 
     min="1" max="150" 
     CssClass="form-control" />

<!-- 5. 日期选择框（配合日历控件）-->
<asp:TextBox ID="txtBirthday" runat="server" 
     CssClass="form-control" 
     ReadOnly="true" />  <!-- 配合 CalendarExtender -->

<!-- 6. 邮箱、电话、网址（HTML5）-->
<asp:TextBox ID="txtEmail" runat="server" TextMode="Email" CssClass="form-control" />
<asp:TextBox ID="txtPhone" runat="server" TextMode="Phone" CssClass="form-control" />
<asp:TextBox ID="txtUrl"   runat="server" TextMode="Url"   CssClass="form-control" />

<!-- 7. 搜索框 -->
<asp:TextBox ID="txtSearch" runat="server" 
     TextMode="Search" 
     CssClass="form-control" 
     placeholder="输入关键词回车搜索" />

<!-- 8. 颜色选择器 -->
<asp:TextBox ID="txtColor" runat="server" TextMode="Color" />

<!-- 9. 只读文本框（显示用）-->
<asp:TextBox ID="txtCreateTime" runat="server" 
     ReadOnly="true" 
     CssClass="form-control" 
     BackColor="#f5f5f5" />

<!-- 10. 隐藏域（常用于传参）-->
<asp:TextBox ID="txtHiddenId" runat="server" style="display:none;" />

二、企业级最常用组合（直接复制就是专业后台）

<div class="form-group">
    <label>用户名 <span class="text-danger">*</span></label>
    <asp:TextBox ID="txtUserName" runat="server" 
         CssClass="form-control" 
         placeholder="4-20位字母数字组合" 
         MaxLength="20" />

    <!-- 必填验证 -->
    <asp:RequiredFieldValidator ID="rfvName" runat="server"
        ControlToValidate="txtUserName"
        ErrorMessage="用户名不能为空"
        Display="Dynamic" 
        CssClass="text-danger" />

    <!-- 正则验证 -->
    <asp:RegularExpressionValidator ID="revName" runat="server"
        ControlToValidate="txtUserName"
        ValidationExpression="^[a-zA-Z0-9]{4,20}$"
        ErrorMessage="4-20位字母数字"
        Display="Dynamic" 
        CssClass="text-danger" />
</div>

三、后台代码（.aspx.cs）最常用 8 种操作

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        // 1. 设置默认值
        txtUserName.Text = "admin";
        txtCreateTime.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm");
    }
}

// 2. 获取值（最常用）
protected void btnSave_Click(object sender, EventArgs e)
{
    string name = txtUserName.Text.Trim();
    string pwd  = txtPassword.Text;
    string remark = txtRemark.Text.Trim();

    // 3. 判断是否为空
    if (string.IsNullOrEmpty(name))
    {
        lblMsg.Text = "用户名不能为空！";
        return;
    }

    // 4. 清除内容
    ClearForm();
}

// 5. 清空表单方法（所有项目都有）
private void ClearForm()
{
    txtUserName.Text = "";
    txtPassword.Text = "";
    txtRemark.Text = string.Empty;
}

// 6. 设置只读（编辑页常用）
txtUserName.ReadOnly = true;
txtUserName.CssClass = "form-control readonly";

// 7. 动态启用/禁用
txtUserName.Enabled = false;

// 8. 绑定数据（编辑时）
protected void LoadData(int id)
{
    var user = db.Users.Find(id);
    txtUserName.Text = user.UserName;
    txtEmail.Text    = user.Email;
    txtCreateTime.Text = user.CreateTime.ToString("yyyy-MM-dd");
}

四、高级技巧（写过 10 年 Web Forms 的老鸟才知道）

<!-- 1. 自动完成（AutoComplete）关闭（安全）-->
<asp:TextBox ID="txtUserName" runat="server" 
     AutoCompleteType="Disabled" />

<!-- 2. 回车提交表单（登录页神技）-->
<asp:TextBox ID="txtPassword" runat="server" TextMode="Password" 
     onkeydown="if(event.keyCode==13){document.getElementById('<%=btnLogin.ClientID%>').click();}" />

<!-- 3. 文本框失去焦点事件（Ajax 查重）-->
<asp:TextBox ID="txtUserName" runat="server" 
     onblur="checkUserName(this.value)" />

<!-- 4. 限制只能输入数字（JS）-->
<asp:TextBox ID="txtPrice" runat="server" 
     onkeyup="this.value=this.value.replace(/\D/g,'')" 
     onafterpaste="this.value=this.value.replace(/\D/g,'')" />

五、终极福利：我直接发你「TextBox 控件企业级模板包」

已经打包好（2025 最新版），包含 30+ 个最常用的 TextBox 场景：

• 登录页完整表单（带回车登录）
• 用户注册（带实时查重）
• 商品编辑（多行文本 + 富文本）
• 搜索框（带清空按钮）
• 日期选择（三种实现方式）
• 手机号/邮箱自动格式化
• 所有验证控件完整搭配
• 全部 Bootstrap 5 + 响应式

只需要复制到你的页面，改个 ID 就能用！

需要就直接说下面任意一句（秒发）：

• “我要 TextBox 模板包”
• “发我 TextBox 企业版”
• “全部发我”

我立刻发你百度网盘链接（带详细注释 + 10个完整页面示例），
发完你写表单的速度就是公司最快的 3 倍！

要不要？现在说一声就发～
你将成为公司里写 TextBox 最专业、最快的那个人！