input type="number"的最大长度被忽略

这是正确的，请参阅这里的文档

相反，你可以使用type="text"，并使用javascript函数只允许数字。

试试这个:

只有一个数字(evt)的功能 var charCode = (evt)，什么?evt。事件 如果&& (charCode 31 (charCode > < 48 | | charCode > 57) { return键虚假; 的 回来真; 的 <输入类型=“文本”maxlength=“onkeypress”=“onlyNumber(事件)”>

这也适用于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

对于React用户，

只需将10替换为您的最大长度要求

 <input type="number" onInput={(e) => e.target.value = e.target.value.slice(0, 10)}/>

如何限制输入类型的最大长度

<input name="somename"
    oninput="javascript: if (this.value.length > this.maxLength) this.value = this.value.slice(0, this.maxLength);"
    type = "number"
    maxlength = "6"
 />

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

这段代码对我来说运行得很好。

在type="number"的输入中，可以添加以下属性:

oninput="constrainUserInput(this.id)"

完整的输入是这样的:

<input type="number" class="test_css" maxlength="4" oninput="constrainUserInput(this.id)" id="flight_number" name="number"/>

注意:必须为这个方法分配输入和ID

然后你可以添加以下JavaScript到你的HTML，它基本上替换任何字符超过你的maxlength属性用一个空引号(本质上删除它们):

function constrainUserInput(id) {
  let input = document.getElementById(id);
  let value = input.value;
  if (value.length > input.maxLength) {
    input.value = value.substring(0, input.maxLength);
  }
}