我如何允许用户覆盖输入类型数字中的数字（当已经有两个数字时？）>

Question

请参阅下面的JavaScript：

maxLengthDay(event) {
    const maxLength = 2;
    if (event.target.value.length + 1 > maxLength)
      return false;
    else
      return true;
  }
和以下HTML：

<input (keypress)="maxLengthDay($event)" type="number" />
它可以按预期工作，即确保输入框最多仅包含两个字符。如果用户突出显示该数字（特别是当有两个数字时）并尝试覆盖一个或两个数字，则会出现问题。什么也没发生，因为输入控件此时包含两个数字。

我如何允许用户覆盖输入控件中的数字（当已经有两个数字时？）>

[请参见下面的JavaScript：maxLengthDay（event）{const maxLength = 2;如果（event.target.value.length + 1> maxLength）返回false;否则返回true； }和HTML ...

Answer 1

也许，您可以添加一个带有超时的处理程序，该处理程序将允许用户继续输入值，但仅保留最后输入的2位数字。

为了使代码段正常工作，下面的示例基于纯JS。它也可以扩展为在Angular代码中使用。

Answer 2

我将设置min和max属性，然后检查输入数字的有效性，并将任何超出范围的值设置为最大值或最小值。

Answer 3

由于粘贴到输入框，我从注解中将keypress更改为input。