修改

Question

我想在输入中只接受字母，数字和逗号。

我试过了

document.getElementById('input').onkeydown = function (e) {
  const charCode = (typeof e.which === 'number') ? e.which : e.keyCode;
  return (charCode >= 48 && charCode <= 57) || // numbers
         (charCode >= 65 && charCode <= 90) || // letters
         charCode === 188                      // comma
};

它有效，但它也拒绝使用箭头键，输入，删除和退格（以及可能的其他重要键）。

我可以添加另一个or子句并告诉用户是否按下了一个键箭头，输入，删除或退格，但这是正确的方法吗？我错过了一些钥匙吗？平板电脑，台式机和智能手机的关键代码是否相同？

修改

如果我还想确保用户从不输入两个连续的逗号怎么办？所以它不接受a,b,,c？

Answer 1

根据MDN，charCode和which均已弃用，建议您使用keyboardEvent.key。

有趣的是，您为此问题标记了regex，但我没有在您的问题中明确地看到正则表达式。但是，以下样本应该足够了。有关大多数浏览器中的本机正则表达式支持的详细信息，请参阅String.prototype.match ...

document.getElementById('input').onkeydown = function (e) {
  var value =  e.target.value;
  //only allow a-z, A-Z, digits 0-9 and comma, with only 1 consecutive comma ...
  if (!e.key.match(/[a-zA-Z0-9,]/) || (e.key == ',' && value[value.length-1] == ',')) {
    e.preventDefault();  
  }
};

Type Value: <input id="input" type="text" />

你也可以使用character classes - 例如\d和\w，\w包含下划线字符（_）：

document.getElementById('input').onkeydown = function (e) {
  var value =  e.target.value;
  //only allow a-z, A-Z, digits 0-9 and comma, with only 1 consecutive comma ...
  if (e.key.match(/_/) || !e.key.match(/[\w\d,]/) || (e.key == ',' && value[value.length-1] == ',')) {
    e.preventDefault();  
  }
};

Type Value: <input id="input" type="text" />

只接受输入

修改

1 个答案: