asp.net-水印文本框/字符过滤文本框-CFANZ编程社区

asp.net-水印文本框/字符过滤文本框_css

asp.net-水印文本框/字符过滤文本框_html_02

要事先下载AjaxControlToolkit解压后拉入工具箱，如图：

asp.net-水印文本框/字符过滤文本框_ajax_03

水印和过滤扩展程序的属性如下：

asp.net-水印文本框/字符过滤文本框_ajax_04

asp.net-水印文本框/字符过滤文本框_ajax_05

.master代码如下：

<%@ Master Language="VB" CodeFile="0_MST_ASPNET12.master.vb" Inherits="_0_MST_ASPNET12" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="CSS/CSS_DEFAULT.css" rel="stylesheet" type="text/css" />
    <link href ="JS/jquery-1.9.1.js" type ="text/javascript" />
    
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div style ="width:720px; margin:0px auto;">
        <div id="div_nav">

            <asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1" 
                Orientation="Horizontal" StaticDisplayLevels="2">
            </asp:Menu>
        
        
            <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
        
        
        </div>


        <%--说明性文字--%>
        <div id="div_memo">
            <asp:ContentPlaceHolder id="CPH_memo" runat="server" />
        </div>


        <%--主程序及控件--%>
        <div id="div_main">
            <asp:ContentPlaceHolder id="cph_main" runat="server"/>        
        </div>


        <%--输出部分--%>
        <div id="div_result">
        <h4>输出检测内容:</h4>
             <asp:ContentPlaceHolder id="cph_output" runat="server"/>        
        </div>



        
    </div>
    </form>
</body>
</html>

在设置扩展程序之前，要先导入ToolkitScriptManager，如不导入会出现如下错误：

asp.net-水印文本框/字符过滤文本框_asp.net_06

.aspx代码如下：

<%@ Page Title="" Language="C#" MasterPageFile="~/0_MST_ASPNET12.master" AutoEventWireup="true" CodeFile="S2_FilteredTextBox_WaterMark.aspx.cs" Inherits="Sample_code_S2_FilteredTextBox" %>


 <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>


 <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
 </asp:Content>
 <asp:Content ID="Content2" ContentPlaceHolderID="CPH_memo" Runat="Server">
     <ol>
         <li>注意FilterType:Custom 与 FilterMode 组合的作用方式</li>
         <li>容易理解与记忆的方式：FilterType:Custom,Numbers, FilterMode:ValidChar, ValidChar:"abc" <br />
                 作用结果：0123456789abc</li>
     </ol>
 </asp:Content>


 <asp:Content ID="Content3" ContentPlaceHolderID="cph_main" Runat="Server">
     <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
     </asp:ToolkitScriptManager>


     <p><span class ="ttl">银行卡号：</span>
     <asp:TextBox ID="txt_BankNo" runat="server" Columns="30"></asp:TextBox></p>


     <p><span class ="ttl">姓名：</span>
     <asp:TextBox ID="txt_Name" runat="server" Columns="30"></asp:TextBox></p>


     <p><span class ="ttl">十六进制数：</span>
     <asp:TextBox ID="txt_HEX" runat="server" Columns="30"></asp:TextBox></p>


     <p><span class ="ttl">有效用户名：</span>
     <asp:TextBox ID="txt_UserID" runat="server" Columns="30"></asp:TextBox></p>


     <p><span class ="ttl">反向过滤例子：</span>
     <asp:TextBox ID="TextBox1" runat="server" Columns="30"></asp:TextBox>
         <asp:TextBoxWatermarkExtender ID="TextBox1_TextBoxWatermarkExtender" 
             runat="server" Enabled="True"  TargetControlID="TextBox1" WatermarkText="不允许输入123" WatermarkCssClass="waterMark">
         </asp:TextBoxWatermarkExtender>
         <asp:FilteredTextBoxExtender ID="TextBox1_FilteredTextBoxExtender" 
             runat="server" Enabled="True"  TargetControlID="TextBox1" FilterMode="InvalidChars" InvalidChars="123">
         </asp:FilteredTextBoxExtender>
     </p>



     <%--仅允许数字--%>
     <asp:FilteredTextBoxExtender ID="txt_BankNo_FilteredTextBoxExtender" 
             runat="server" Enabled="True" FilterType="Numbers" TargetControlID="txt_BankNo">
         </asp:FilteredTextBoxExtender>


     <asp:TextBoxWatermarkExtender ID="txt_BankNo_TextBoxWatermarkExtender" 
             runat="server" Enabled="True" TargetControlID="txt_BankNo" 
             WatermarkText ="仅能输入数字" WatermarkCssClass="waterMark">
         </asp:TextBoxWatermarkExtender>


     <%--仅允许大小写字母和"."--%>
     <asp:FilteredTextBoxExtender ID="FilteredTextBoxExtender1" 
             runat="server" Enabled="True" FilterType="LowercaseLetters,UppercaseLetters,Custom" TargetControlID="txt_Name"
              ValidChars="." >
         </asp:FilteredTextBoxExtender>


     <asp:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" 
             runat="server" Enabled="True" TargetControlID="txt_Name" 
             WatermarkText ="仅允许大小写字母和." WatermarkCssClass="waterMark">
         </asp:TextBoxWatermarkExtender>


     <%--仅允许数字和ABCDEF--%>
     <asp:FilteredTextBoxExtender ID="FilteredTextBoxExtender2" 
             runat="server" Enabled="True" FilterType="Numbers,Custom" TargetControlID="txt_HEX"
              ValidChars="ABCDEF" >
         </asp:FilteredTextBoxExtender>


     <asp:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender2" 
             runat="server" Enabled="True" TargetControlID="txt_HEX" 
             WatermarkText ="仅允许数字和字母ABCDEF" WatermarkCssClass="waterMark">
         </asp:TextBoxWatermarkExtender>


     <%--仅允许数字，字母和"_-"--%>
     <asp:FilteredTextBoxExtender ID="FilteredTextBoxExtender3" 
             runat="server" Enabled="True" FilterType="Numbers,Custom,LowercaseLetters,UppercaseLetters" TargetControlID="txt_UserID"
              ValidChars="_-" >
         </asp:FilteredTextBoxExtender>


     <asp:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender3" 
             runat="server" Enabled="True" TargetControlID="txt_UserID" 
             WatermarkText ="仅允许数字和字母和-_" WatermarkCssClass="waterMark">
         </asp:TextBoxWatermarkExtender>
          </asp:Content>


 <asp:Content ID="Content4" ContentPlaceHolderID="cph_output" Runat="Server">
 </asp:Content>

效果图如下：

asp.net-水印文本框/字符过滤文本框_css_07