如何使用jquery屏蔽文本框? [英] How to mask a textbox using jquery?
本文介绍了如何使用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屋!
查看全文