Question

我有一个输入，我想将输入限制为仅字母（A-Z或a-z）。
仅使用HTML input元素中的属性，可以限制实际输入吗？

以下是更多详细信息：

<!-- Code snippet I have now -->
<input type="text" pattern="[A-Za-z]">

使用pattern属性，这只会让用户知道他们是否不符合模式标准，对吗？它实际上不会阻止他们输入5吗？仅使用HTML是否可以阻止用户输入数字（或更具体地说，仅允许他们输入a-z）？

如果不可能，您将如何使用JavaScript？我看到他们有一个onkeypress="someFunction()"的地方，他们检查了输入字符是否是数字，如果是，那么他们将以某种方式停止输入……这是做这种事情的最佳方法吗？
HTML ：

<!-- Something like that? -->
<input type="text" onkeypress="someFunction()">

JavaScript ：

function someFunction() {
    if (event.key < "A" || event.key > "z") {
        // what would I do here?
    }
}

谢谢！

Answer 1

我将使用正则表达式来检查是否满足标准，但是，我认为这可能是在计划JS中做到这一点的最佳方法。我不知道只有HTML可以做到这一点，我认为这是不可能的。

function someFunction(event) {
  // We check the last character inserted
  if (/^[a-zA-Z]$/.test(event.target.value.slice(event.target.value.length - 1))) {
    event.preventDefault();
    // Remove the character from the input
    // Maybe add some class to the element to show error
  }
}

还请注意，由于agata604在其帖子keypress中说过，建议不要使用keydown事件。

Answer 2

function onlyAlphabet(inputVal) {
  var patt=/^[a-zA-Z]+$/;
  if (patt.test(inputVal)) {
    document.getElementById('text').value = inputVal;
  } else {
    var txt = inputVal.slice(0, -1);
    document.getElementById('text').value = txt;
  }

}

<input id="text" type="text" oninput="onlyAlphabet(value)">

Answer 3

我不知道要检查按键是否被按下，但是如果它只是一个输入，那么您可以这样做吗？

<input type="text" pattern="[A-Za-z]" onkeypress="someFunction()">

将HTML输入限制为特定字符类型

3 个答案: