<input>字段的minlength属性似乎不起作用。

在HTML中是否有其他属性可以帮助我设置字段值的最小长度?


当前回答

我注意到,有时在Chrome中,当自动填充打开时,字段是由自动填充浏览器内置方法填写的,它绕过了最小长度验证规则,所以在这种情况下,你必须通过以下属性禁用自动填充:

autocomplete = "结束"

<input autocomplete="new-password" name="password" id="password" type="password" placeholder="Password" maxlength="12" minlength="6" required />

其他回答

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">

不是HTML5,但无论如何都很实用:如果你碰巧使用AngularJS,你可以在输入和文本区域都使用ng-minlength(或data-ng-minlength)。看看这个Plunk。

现在HTML5规范中有一个minlength属性,以及有效性。tooShort接口。

现在所有现代浏览器的最新版本都启用了这两个功能。具体操作请参见https://caniuse.com/#search=minlength。

我的解决方案textarea使用jQuery和结合HTML5需要验证,以检查最小长度。

minlength.js

$(document).ready(function(){
  $('form textarea[minlength]').on('keyup', function(){
    e_len = $(this).val().trim().length
    e_min_len = Number($(this).attr('minlength'))
    message = e_min_len <= e_len ? '' : e_min_len + ' characters minimum'
    this.setCustomValidity(message)
  })
})

HTML

<form action="">
  <textarea name="test_min_length" id="" cols="30" rows="10" minlength="10"></textarea>
</form>

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

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

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