Question

在输入框中，我使用e.preventDefault();来停止inputValue.length > 10之后的文本输入。但是文本输入始终以11个字符而不是10个字符停止。我无法理解为什么它不会停止在10处接受字符。为什么会这样？非常感谢！

'use strict';
	
document.querySelectorAll('.input_style')[0].addEventListener('keydown', pressKey);	
document.querySelectorAll('.input_style')[0].addEventListener('keyup', releaseKey);

function pressKey(e) {
  let inputValue = e.target.value;		
  if (inputValue.length > 10) {
    e.preventDefault();
  }
}

function releaseKey(e) {
  let inputValue = e.target.value;
  console.log(inputValue.length);
  if (inputValue.length > 10 ) {
    e.preventDefault();
  }
}

.input_style {
  font-size: 2rem;
  font-family: arial;
}

<input class="input_style">

Answer 1

对于条件＆gt;，字符串的长度必须为11。 10是真的。如果你想在10点停止，请执行＆gt; = 10。

Answer 2

你的情况一直等到大于 10，所以只有在11岁时才会满足这个条件。

Answer 3

此处的问题是新值会添加到input上的keydown，而非keyup，并且您的keydown处理程序pressKey(e)正在检查在添加新值之前输入框的当前值。因此，您需要检查length >= 10而不是>10。

在这种情况下，keyup处理程序是完全没必要的，因为它不会阻止添加新值。

您应该考虑的另一件事是检查输入keycode值8（"backspace"）和46（"delete"），并允许这些值处理。就像现在一样，一旦你的输入框已满，就不可能以任何方式改变它，因为你不能使用 backspace 或 delete 删除一个错误的字符

为什么文本输入继续超过其最大长度限制的1个字符？

3 个答案: