maxlength属性对<input type="number">不起作用。这只发生在Chrome。
<input type="number" class="test_css" maxlength="4" id="flight_number" name="number"/>
maxlength属性对<input type="number">不起作用。这只发生在Chrome。
<input type="number" class="test_css" maxlength="4" id="flight_number" name="number"/>
当前回答
试着用tel:
maxlength="5" type="tel"
其他回答
我最近尝试的绝对解决方案是:
<input class="class-name" placeholder="1234567" name="elementname" type="text" maxlength="4" onkeypress="return (event.charCode == 8 || event.charCode == 0 || event.charCode == 13) ? null : event.charCode >= 48 && event.charCode <= 57" />
我有这个问题在django形式。这就是我解题的代码。
HTML
<input type="tel" maxlength="6" oninput="this.value=this.value.replace(/[-]/g,'');"></input> <!-- I needed to remove the "-" sinc tell field accepts it. -->
Django形式
class TokenForm(forms.Form):
code = forms.CharField(
required=True,
label="Enter 6 digit confirmation code",
widget=forms.TextInput(
attrs={
"class": "form-control",
"placeholder": "Enter 6 digit code",
"type": "tel",
"maxlength":"6",
"oninput":"this.value=this.value.replace(/[-]/g,'');"
}
),
)
从MDN的文档<input>
如果type属性的值是text、email、search、password、tel或url,则此属性指定用户可以输入的最大字符数(Unicode码位);对于其他控件类型,它将被忽略。
因此maxlength在<input type="number">上被故意忽略。
根据你的需要,你可以像inon在他/她的回答中建议的那样使用min和max属性(注意:这只会定义一个受限的范围,而不是值的实际字符长度,尽管-9999到9999将覆盖所有0-4位数字),或者你可以使用常规文本输入,并使用新模式属性对字段强制验证:
<input type="text" pattern="\d*" maxlength="4">
您可以使用min和max属性。
下面的代码做同样的事情:
<输入类型=“数字” 最小=“-999” 最大=“9999”/>
我有两种方法
首先:使用type="tel",它将像mobile中的type="number"一样工作,并接受maxlength:
<input type="tel" />
第二:使用一点JavaScript:
<!-- maxlength="2" -->
<input type="tel" onKeyDown="if(this.value.length==2 && event.keyCode!=8) return false;" />