<input>字段的minlength属性似乎不起作用。
在HTML中是否有其他属性可以帮助我设置字段值的最小长度?
<input>字段的minlength属性似乎不起作用。
在HTML中是否有其他属性可以帮助我设置字段值的最小长度?
当前回答
不是HTML5,但无论如何都很实用:如果你碰巧使用AngularJS,你可以在输入和文本区域都使用ng-minlength(或data-ng-minlength)。看看这个Plunk。
其他回答
我使用了最大值和最小值,这对我来说很有效,但我不确定这是否是一种编码方法。
<input type="text" maxlength="13" name ="idnumber" class="form-control" minlength="13" required>
我使用maxlength和minlength,无论是否需要,它对我来说都非常适合HTML5。
<输入id=“passcode”类型=“minlength”密码=“8”,maxlength=“10”>
`
这是html5的唯一解决方案(如果你想要minlength 5, maxlength 10字符验证)
http://jsfiddle.net/xhqsB/102/
< >形式 <输入模式= "。{5 10}" > <input type="submit" value="Check"></input> > < /形式
新版本:
它扩展了使用(文本区域和输入)并修复了错误。
// Author: Carlos Machado
// Version: 0.2
// Year: 2015
window.onload = function() {
function testFunction(evt) {
var items = this.elements;
for (var j = 0; j < items.length; j++) {
if ((items[j].tagName == "INPUT" || items[j].tagName == "TEXTAREA") && items[j].hasAttribute("minlength")) {
if (items[j].value.length < items[j].getAttribute("minlength") && items[j].value != "") {
items[j].setCustomValidity("The minimum number of characters is " + items[j].getAttribute("minlength") + ".");
items[j].focus();
evt.defaultPrevented;
return;
}
else {
items[j].setCustomValidity('');
}
}
}
}
var isOpera = !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;
var isChrome = !!window.chrome && !isOpera;
if(!isChrome) {
var forms = document.getElementsByTagName("form");
for(var i = 0; i < forms.length; i++) {
forms[i].addEventListener('submit', testFunction,true);
forms[i].addEventListener('change', testFunction,true);
}
}
}
您可以使用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)">