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"/>
当前回答
这也适用于Android
更改输入类型为文本,并使用"oninput"事件调用函数:
<input type="text" oninput="numberOnly(this.id);" maxlength="4" id="flight_number" name="number"/>
现在使用Javascript Regex过滤用户输入,并将其限制为数字:
function numberOnly(id) {
// Get element by id which passed as parameter within HTML element event
var element = document.getElementById(id);
// This removes any other character but numbers as entered by user
element.value = element.value.replace(/[^0-9]/gi, "");
}
演示:https://codepen.io/aslami/pen/GdPvRY
其他回答
最大长度-输入类型文本
<input type="email" name="email" maxlength="50">
使用jQuery:
$("input").attr("maxlength", 50)
最大输入类型号
JS
function limit(element, max) {
var max_chars = max;
if(element.value.length > max_chars) {
element.value = element.value.substr(0, max_chars);
}
}
HTML
<input type="number" name="telefono" onkeydown="limit(this, 20);" onkeyup="limit(this, 20);">
根据Neha Jain上面的回答,我只是把下面的代码添加到公共区域
$(':input[type="number"]').on('input', function() {
if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);
});
然后你可以像文本类型字段一样使用maxlength="4"。
我会让这个快速和容易理解!
使用min= "和max= "代替maxlength for type='number' (maxlength用于定义文本类型中字符串的最大字母数)。
干杯
<input type=“number” min=“1” onKeyPress=“if(this.value.length==5) 返回 false”/>
使用类型数字与min和处理max与onKeyPress
<input type="number" min="1" onKeyPress="if(this.value.length==5) return false"/>
完成了!只有数字和maxlength工作完美。
<input maxlength="5" data-rule-maxlength="5" style="height:30px;width: 786px;" type="number" oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength); this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');" />