如何使用javascript或jquery限制字段中字符输入的数量

How can I restrict number of character input in a field with javascript or jquery?

本文关键字：字符输入 字段 javascript 何使用 jquery      更新时间：2023-09-26

我为一个输入文本字段编写了一个验证代码，它将只接受数字和一些控制键。我接受了stackoverclow的帮助:)，所以我再次来到这里接受帮助。验证码是

 $("#txtLevel1Year").keydown(function(event)
            {
                // Allow only backspace,delete,left arrow,right arraow and Tab
                if ( event.keyCode == 46 
                    || event.keyCode == 8 
                    || event.keyCode == 37 
                    || event.keyCode == 39 
                    || event.keyCode == 9)
                    {
                    // let it happen, don't do anything
                    }
                    else {
                        // Ensure that it is a number and stop the keypress
                        if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode <96 ||event.keyCode > 105) ) {
                            event.preventDefault(); 
                        }   
                    }
            });

现在让我告诉你我在寻找什么，首先，我想限制这个字段只接受4位数字。不多不少，第二个是关于优化的。我希望此验证工作的文本字段是(are)

<asp:TextBox runat="server" ID="txtLevel1Year" Width="50px" TabIndex="13"></asp:TextBox>  
                        <asp:TextBox runat="server" ID="txtLevel2Year" Width="50px" TabIndex="17"></asp:TextBox>  
                        <asp:TextBox runat="server" ID="txtLevel3Year" Width="50px" TabIndex="21"></asp:TextBox>  
                        <asp:TextBox runat="server" ID="txtLevel4Year" Width="50px" TabIndex="25"></asp:TextBox>

在这里，我可以重复验证代码4次，通过获取四个不同的id，使此工作，尽管验证是完全相同的。我能做些什么来消除这种重复吗?如果我的问题你不清楚，请让我知道。提前感谢大家。这是这个问题的编辑部分，我已经通过创建一个CSS类实现了优化的目标，并在我放置所有年份文本框的div中调用它。但我的极限是4位数还没有解决。请帮帮我。

我假设您的验证有效。诀窍是为所有文本框添加一个类。假设类名是

.validateTB

然后按如下方式修改脚本

$(".validateTB").keydown(function(event)
        {
            // Allow only backspace,delete,left arrow,right arraow and Tab
            if ( event.keyCode == 46 
                || event.keyCode == 8 
                || event.keyCode == 37 
                || event.keyCode == 39 
                || event.keyCode == 9)
                {
                // let it happen, don't do anything
                }
                else {
                    // Ensure that it is a number and stop the keypress
                    if ((event.keyCode < 48 || event.keyCode > 57) && (event.keyCode   <96 ||event.keyCode > 105) ) {
                        event.preventDefault(); 
                    }   
                }
        });

请记住，您可以在HTML中设置<input maxlength="4">作为解决一半问题的简单解决方案。然而，这只能防止浏览器用户输入超过4个字符，但你可以通过调用一些JS函数来设置更长的值，从而通过编程来避免它。

试试这个(不允许闪烁，也不允许复制粘贴):

$(".validate").keyup(function(event) {
    var val = $(this).val();
    if (val.length > 5) {
        val = val.substring(0, 5);
        $(this).val(val);
        return false;
    }
}).keypress(function(event) {
    if ($(this).val().length > 4) {
        return false;
    }
});
http://jsfiddle.net/xEMzx/

好的，首先为所有四个字段设置验证代码，您可以使用类选择器(在为所有元素定义类之后):

<asp:TextBox runat="server" class='validate'
 $(".validate").keydown(function(event)

检查长度，您可以使用keyup事件(根据我的经验，这更适合此任务)

 $(".validate").keyup(function(event){
         var val = $(this).val();
         if (val.length > 4){
            alert ("Max length is 4");
            val = val.substring(0, val.length - 1);
            $(this).val(val);
            $(this).focus();
            return false;
          }
   });

提琴在这里:http://jsfiddle.net/a5BJX/

相关文章：