maxlength属性对<input type="number">不起作用。这只发生在Chrome。

<input type="number" class="test_css"  maxlength="4"  id="flight_number" name="number"/>

当前回答

如果你想在React函数组件中实现它,或者不使用“this”,这里有一种方法。

<input onInput={handleOnInput}/>

const handleOnInput = (e) => {
  let maxNum = 4;
  if (e.target.value.length > maxNum) {
    e.target.value = e.target.value.slice(0, maxNum);
  }
};

其他回答

您可以使用min和max属性。

下面的代码做同样的事情:

<输入类型=“数字” 最小=“-999” 最大=“9999”/>

我会让这个快速和容易理解!

使用min= "和max= "代替maxlength for type='number' (maxlength用于定义文本类型中字符串的最大字母数)。

干杯

这个代码对我有用

<形式方法=“post”> <label for="myNumber">我的号码:</label> <input type="number" maxlength="9" required Oninput ="javascript: if (this.value。长度> this. maxlength) this。Value = this.value。片(0,this.maxLength);“> < br > < br > <input type="submit" value=" submit" > > < /形式

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

<input type="tel" maxlength="4" />
<input type="number" oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');" onKeyDown="if(this.value.length==10 && event.keyCode!=8) return false;">

演示 - JSFIDDLE