<input type="number" maxlength="5" class="search-form-input" name="techforge_apartmentbundle_searchformtype[radius]" id="techforge_apartmentbundle_searchformtype_radius">
<input type="number" oninput="if(this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);" maxlength="2">
<input name="somename"
oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
type = "number"
maxlength = "6"
/>maxlength 属性不适用于 type="number" 的输入框。
根据 W3 HTML5 规范，type="number" 元素不能指定以下内容属性，也不适用于它们：accept、alt、checked、dirname、formaction、formenctype、formmethod、formnovalidate、formtarget、height、maxlength、multiple、pattern、size、src 和 width。
参考资料：http://dev.w3.org/html5/spec/Overview.html#number-state-type-number（位于 "Bookkeeping details" 下）。
在 Firefox 和 IE 中，输入框会回退为文本输入框，因此 maxlength 属性会作用于输入框。一旦 Firefox 和 IE 实现了 type="number"，它们还应该以不适用 maxlength 的方式实现它。
<input type="number" name="no1" maxlength="1" size="1" max="9" pattern="[0-9]*" />
以下是js代码:
$('input[name="no1"]').keypress(function() {
if (this.value.length >= 1) {
return false;
}
});
以下是一个使用 type="number" 和 maxlength 的示例，可在Chrome、IE和其他浏览器中正常工作。希望对您有所帮助！
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
function test(id, event) {
var element = $("#" + id);
var len = element.val().length + 1;
var max = element.attr("maxlength");
var cond = (46 < event.which && event.which < 58) || (46 < event.keyCode && event.keyCode < 58);
if (!(cond && len <= max)) {
event.preventDefault();
return false;
}
}
</script>
</head>
<body>
<input id="test" size="3" type="number" maxlength="3" onkeypress="test(this.id, event)">
</body>
</html>
对于使用React的人来说，如果有人在这里遇到了问题，这个解决方案对我很有效 :)
<input type="number" name="expiry" placeholder="Expiry" onChange=
{this.handleInputChange} onFocus={this.handleInputFocus} onInput={(event)=>event.target.value=event.target.value.slice(0,event.target.maxLength)}
maxLength="4" />
max="9999"，这样做与现有答案相比有何优势？ - Zach Jensz我使用以下 jQuery 代码解决了问题：
$('input[type="number"]').on('keypress', function (e) {
var maxlength = $(this).prop('maxlength');
if (maxlength !== -1) { // Prevent execute statement for non-set maxlength prop inputs
var length = $(this).val().trim().length;
if (length + 1 > maxlength) e.preventDefault();
}
});
如果您想要设置每个的maxlength属性，就像文本输入框一样，只需进行设置。
对于正在使用 React 并且来到这里的人：
<input name="maxNumber"
onInput= {(event)=> event.target.value.length > 1 ?
event.target.value =
event.target.value.slice(0, 1)
:
event.target.value
}
type = "number"
/>