最大长度-输入类型文本

<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);">

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

在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);
  }
}

对于有长度限制的数字输入，您也可以尝试这种方法

<input type="tel" maxlength="4" />

我写了一个小而干净的解决方案。使用这个函数可以使它正常工作

  const inputHandler = (e) => {
    const { value, maxLength } = e.target;
    if (String(value).length >= maxLength) {
      e.preventDefault();
      return;
    }
  };

例如，它可以在React中这样使用:

<input
  type="number"
  maxlength="4"
  onKeyPress={inputHandler}
/>

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

我可以用这个存档。

<input type="text" onkeydown="javascript: return event.keyCode === 8 || event.keyCode === 46 ? true : !isNaN(Number(event.key))" maxlength="4">