## WebForm TextBox 숫자 only 입력하기 #####
1. pure javascript 방식
<%@ Page Language="C#" AutoEventWireup="true" %> <html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko"> <head id="Head1" runat="server"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Sample</title> <script type="text/javascript" language="javascript" src="/scripts/jquery.min.js"></script> <script type="text/javascript" language="javascript"></script> </head> <body> <form id="frm" name="frm" runat="server" action="sample.aspx" method="post"> <asp:TextBox ID="Txt_HP1" runat="server" title="핸드폰앞3자리" MaxLength="3" style="IME-MODE:disabled;" onkeyPress="numOnly();"></asp:TextBox> - <asp:TextBox ID="Txt_HP2" runat="server" title="핸드폰중간4자리" MaxLength="4" style="IME-MODE:disabled;" onkeyPress="numOnly();"></asp:TextBox> - <asp:TextBox ID="Txt_HP3" runat="server" title="핸드폰중간4자리" MaxLength="4" style="IME-MODE:disabled;" onkeyPress="numOnly();"></asp:TextBox> </form> </body> </html> |
2. JQuery 방식
| <%@ Page Language="C#" AutoEventWireup="true" %> <html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko"> <head id="Head1" runat="server"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Sample</title> <script type="text/javascript" language="javascript" src="/scripts/jquery.min.js"></script> <script type="text/javascript" language="javascript"> <!-- (function ($) { $.fn.removeText = function(_v){ if (typeof(_v)==="undefined"){ $(this).each(function(){ this.value = this.value.replace(/[^0-9]/g,''); }); } else { return _v.replace(/[^0-9]/g,''); } }; $.fn.onlyNumber = function (p) { $(this).each(function(i) { this.value = $(this).removeText(this.value); $(this).bind('keypress keyup',function(e){ this.value = $(this).removeText(this.value); }); }); }; })(jQuery); $(document).ready(function () { $('.numbersOnly').onlyNumber(); }); --> </script> </head> <body> <form id="frm" name="frm" runat="server" action="sample.aspx" method="post"> <asp:TextBox ID="Txt_HP1" runat="server" CssClass="numbersOnly" title="핸드폰앞3자리" MaxLength="3"></asp:TextBox> - <asp:TextBox ID="Txt_HP2" runat="server" CssClass="numbersOnly" title="핸드폰중간4자리" MaxLength="4"></asp:TextBox> - <asp:TextBox ID="Txt_HP3" runat="server" CssClass="numbersOnly" title="핸드폰중간4자리" MaxLength="4"></asp:TextBox> </form> </body> </html> |