如何使用jquery屏蔽文本框? [英] How to mask a textbox using jquery?

查看:59
本文介绍了如何使用jquery屏蔽文本框?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试使用jquery屏蔽文本框,但它有错误。我正在使用VS2010 ASP.Net空白Web表单和C#。我有一个代码是页面的HTML代码。我做错了什么?



I am trying to mask a textbox using jquery and it has errors. I am using VS2010 ASP.Net Blank Web Form and C#. I have a code that is the html code for the page. What am I doing wrong?

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Testcommas.aspx.cs" Inherits="TestNumberCommas.Testcommas" %>
<script src="<%=Page.ResolveUrl("~")%>"Style/javascript/jquery-1.7.1.js" type="text/javascript"></script>
<!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>
    <script src="jquery.js" type="text/javascript"></script>
    <script src="jquery.maskedinput.js" type="text/javascript"></script>
    <script type='text/javascript'>
        jQuery(function ($) {
            $("#TextBoxY").mask("999,999,999,999");
        });

    </script>

    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            width: 245px;
        }
        .style3
        {
            width: 66px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    <table class="style1">
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBoxINST_ID" runat="server"></asp:TextBox>
            </td>
            <td>
                <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Submit" 

                    Width="100px" />
            </td>
        </tr>
        <tr>
            <td class="style3">
                Hourly</td>
            <td class="style2">
                <asp:TextBox ID="TextBoxH" runat="server" Width="180px"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                Yearly</td>
            <td class="style2">
                <asp:TextBox ID="TextBoxY" runat="server" Width="180px" 

                    AutoCompleteType="Email"></asp:TextBox>
               
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBoxadd" runat="server" Width="180px"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBoxadd1" runat="server" Width="180px"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBoxadd2" runat="server" Width="180px"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBoxadd3" runat="server" Width="180px" AutoPostBack="True" 

                    ontextchanged="TextBoxadd3_TextChanged"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
        <tr>
            <td class="style3">
                 </td>
            <td class="style2">
                <asp:TextBox ID="TextBoxadd4" runat="server" Width="180px"></asp:TextBox>
            </td>
            <td>
                 </td>
        </tr>
    </table>
    </form>
</body>
</html>

推荐答案

){


#TextBoxY)。mask ( 999,999,999,999);
});

< / script >

< style type = text / css >
style1
{
width 100%;
}
style2
{
width 245px;
}
style3
{
width 66px;
}
< / style >
</head> ;
<body >
<form id=\"form1\" runat=\"server\">
& lt;div>

</div>
<table class=\"style1\">
<tr>
<td class=\"style3\">
 </td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxINST_ID\" runat=\"server\"></asp:TextBox>
</td>
<td>
<asp:Button ID=\"Button1\" runat=\"server\" onclick=\"Button1_Click\" Text=\"Submit\"

Width=\"100px\" />
</td>
</tr>
<tr>
<td class=\"style3\">
Hourly</td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxH\" runat=\"server\" Width=\"180px\"></asp:TextBox>
</td>
<td>
 </td>
</tr>
<tr>
<td class=\"style3\">
Yearly</td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxY\" runat=\"server\" Width=\"180px\"

AutoCompleteType=\"Email\"></asp:TextBox>

</td>
<td>
 </td>
</tr>
<tr>
<td class=\"style3\">
 </td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxadd\" runat=\"server\" Width =\"180px\"></asp:TextBox>
</td>
<td>
 </td>
</tr>
<tr>
<td class=\"style3\">
 </td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxadd1\" runat=\"server\" Width=\"180px\"></asp:TextBox>
</td>
<td>
 </td>
</tr>
<tr>
<td class=\"style3\">
 </td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxadd2\" runat=\"server\" Width=\"180px\"></asp:TextBox>
</td>
<td>
 </td>
< ;/tr>
<tr>
<td class=\"style3\">
 </td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxadd3\" runat=\"server\" Width=\"180px\" AutoPostBack=\"True\"

ontextchanged=\"TextBoxadd3_TextChanged\"></asp:TextBox>
</td>
<td>
 </td>
</tr>
<tr>
<td class=\"style3\">
 </td>
<td class=\"style2\">
<asp:TextBox ID=\"TextBoxadd4\" runat=\"server\" Width=\"180px\"></asp:TextBox>
</td>
<td>
 </td>
</tr>
</table>
</form>
</body>
</html>
("#TextBoxY").mask("999,999,999,999"); }); </script> <style type="text/css"> .style1 { width: 100%; } .style2 { width: 245px; } .style3 { width: 66px; } </style> </head> <body> <form id="form1" runat="server"> <div> </div> <table class="style1"> <tr> <td class="style3">  </td> <td class="style2"> <asp:TextBox ID="TextBoxINST_ID" runat="server"></asp:TextBox> </td> <td> <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Submit" Width="100px" /> </td> </tr> <tr> <td class="style3"> Hourly</td> <td class="style2"> <asp:TextBox ID="TextBoxH" runat="server" Width="180px"></asp:TextBox> </td> <td>  </td> </tr> <tr> <td class="style3"> Yearly</td> <td class="style2"> <asp:TextBox ID="TextBoxY" runat="server" Width="180px" AutoCompleteType="Email"></asp:TextBox> </td> <td>  </td> </tr> <tr> <td class="style3">  </td> <td class="style2"> <asp:TextBox ID="TextBoxadd" runat="server" Width="180px"></asp:TextBox> </td> <td>  </td> </tr> <tr> <td class="style3">  </td> <td class="style2"> <asp:TextBox ID="TextBoxadd1" runat="server" Width="180px"></asp:TextBox> </td> <td>  </td> </tr> <tr> <td class="style3">  </td> <td class="style2"> <asp:TextBox ID="TextBoxadd2" runat="server" Width="180px"></asp:TextBox> </td> <td>  </td> </tr> <tr> <td class="style3">  </td> <td class="style2"> <asp:TextBox ID="TextBoxadd3" runat="server" Width="180px" AutoPostBack="True" ontextchanged="TextBoxadd3_TextChanged"></asp:TextBox> </td> <td>  </td> </tr> <tr> <td class="style3">  </td> <td class="style2"> <asp:TextBox ID="TextBoxadd4" runat="server" Width="180px"></asp:TextBox> </td> <td>  </td> </tr> </table> </form> </body> </html>


try with

try with
<script type='text/javascript'>


这篇关于如何使用jquery屏蔽文本框?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆