这是html5的唯一解决方案(如果你想要minlength 5, maxlength 10字符验证)

http://jsfiddle.net/xhqsB/102/

< >形式 <输入模式= "。{5 10}" > <input type="submit" value="Check"></input> > < /形式

看到http://caniuse.com/搜索=最小长度。某些浏览器可能不支持此属性。

如果"type"的值是其中之一:

文本，电子邮件，搜索，密码，电话或URL(警告:不包括数字|没有浏览器支持“电话”现在- 2017.10)

使用minlength(/ maxlength)属性。它指定最小字符数。

例如,

<input type="text" minlength="11" maxlength="11" pattern="[0-9]*" placeholder="input your phone number">

或者使用"pattern"属性:

<input type="text" pattern="[0-9]{11}" placeholder="input your phone number">

如果“type”是number，虽然不支持minlength(/ maxlength)，但可以使用min(/ max)属性来代替它。

例如,

<input type="number" min="100" max="999" placeholder="input a three-digit number">

maxlength最聪明的方法

$(“html”)。On ("keydown keyup change"， "input"， function(){ var最大长度= $(这).attr(最大长度); 如果(最大长度){ = $ var值(这).val (); 如果(value.length < =最大长度){ (美元).attr(“v”,价值); ｝ 其他{ ((这).val美元(这).attr (' v ')); ｝ ｝ })； < script src = " https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js " > < /脚本> <input type="text" maxlength="10">

我写了这个JavaScript代码，[minlength.js]:

window.onload = function() {
    function testaFunction(evt) {
        var elementos = this.elements;
        for (var j = 0; j < elementos.length; j++) {
            if (elementos[j].tagName == "TEXTAREA" && elementos[j].hasAttribute("minlength")) {
                if (elementos[j].value.length < elementos[j].getAttribute("minlength")) {
                    alert("The textarea control must be at least " + elementos[j].getAttribute("minlength") + " characters.");
                    evt.preventDefault();
                };
            }
        }
    }
    var forms = document.getElementsByTagName("form");
    for(var i = 0; i < forms.length; i++) {
        forms[i].addEventListener('submit', testaFunction, true);
    }
}

如果需要这种行为，总是在输入字段上显示一个小前缀，否则用户不能删除前缀:

   // prefix="prefix_text"
   // If the user changes the prefix, restore the input with the prefix:
   if(document.getElementById('myInput').value.substring(0,prefix.length).localeCompare(prefix))
       document.getElementById('myInput').value = prefix;

您可以使用pattern属性。还需要必需的属性，否则带有空值的输入字段将被排除在约束验证之外。

<input pattern=".{3,}"   required title="3 characters minimum">
<input pattern=".{5,10}" required title="5 to 10 characters">

如果你想创建一个选项来使用“空，或最小长度”的模式，你可以这样做:

<input pattern=".{0}|.{5,10}" required title="Either 0 OR (5 to 10 chars)">
<input pattern=".{0}|.{8,}"   required title="Either 0 OR (8 chars minimum)">