如果输入类型=数字,则maxlength=5不起作用

maxlength=5 not working if input type=number

本文关键字:maxlength 不起作用 数字 输入 类型 如果      更新时间:2023-10-12

这太令人沮丧了!

当输入类型为text并且我将maxlength设为5时,它不允许我输入超过5个字符的

<input type="text"  maxlength="5" />

如果我把输入类型设为number,把maxlength设为5,它是否允许5位以上的数字?

<input type="number" maxlength="5" pattern="[0-9]*" />

我是不是错过了什么?

附言:这是为移动响应网站!

使用max 而不是maxlength

<input type="number" min="1" max="10000" />

更新

小型jQuery插件

(function ($) {
    $.fn.maxlength = function (length) {
        return this.on('keydown', function () {
            var maxlength = length || parseInt($(this).attr('maxlength'), 10) ;
            if (maxlength && $(this).val().length >= maxlength) {
                $(this).val($(this).val().slice(0, maxlength - 1));
            }
        });
    };
}($));

示例

尝试使用max。。。

<input type="number" max="99999" />

编辑:显示验证

<form id='FormValidation'>
<input id="myNum" type="number" min="1" max="99999" />
<input type="text"  maxlength="5" />
    <input type="submit" />
</form>

尝试添加一个大于99999的数字,然后点击提交,检查更新后的fiddle。

这个jquery也有帮助。。。

$('#myNum').keyup( function(e){
    var max = $('#myNum').attr('max').length;
    if ($(this).val().length >= max) { 
        $(this).val($(this).val().substr(0, max));
    }
});

max 替换maxlength

 // Max Length = 5
<input type="number" max="99999" />
// length between 1 to 5
<input type="number" min="1" max="99999" />

更新的答案。太简单了!

<input type="number" id="nbr"/>
<input type="text"  maxlength="5" />
$(document).on('keypress','#nbr', function(e){
if($(this).val().length >= 5)
   {
       e.preventDefault();
   }
});

您可以添加一个最大属性,该属性将指定您可以插入的最大可能数字

<input type="number" max="999" />

如果同时添加最大值和最小值,则可以指定允许值的范围:

<input type="number" min="1" max="999" />