仅接受数字和短划线字符的输入文本字段

Input text field that only accepts numbers AND the dash character

本文关键字：字符 输入 文本 字段 数字      更新时间：2023-09-26

我正在使用常用的Javascript函数，只允许将数字输入到文本字段中：

function isNumberKey(evt)
{
  var charCode = (evt.which) ? evt.which : event.keyCode;
  if (charCode != 46 && charCode > 31
    && (charCode < 48 || charCode > 57))
     return false;
  return true;
}

我称之为按键，它可以防止显示除数字以外的任何内容。我正在尝试更改它，以便它也允许我在文本字段中放置破折号 （-）。破折号键代码是 189，所以我试了这个：

function isNumberKey(evt)
{
  var charCode = (evt.which) ? evt.which : event.keyCode;
  if (charCode != 46 && charCode != 189 && charCode > 31
    && (charCode < 48 || charCode > 57))
     return false;
  return true;
}

认为条件语句会接受破折号字符，但这似乎不起作用。关于为什么会这样的任何想法？感谢您的帮助！

如果使用按键

事件，则需要使用短划线/连字符的字符代码 45。

如果您使用的是 keydown/keyup 事件，则需要使用 109 和 189 来覆盖数字键盘中的减号键和（通常）位于 P 键上方的减号键。

if (charCode != 46 && charCode != 45 && charCode > 31
    && (charCode < 48 || charCode > 57))
     return false;

演示：http://jsfiddle.net/J6B7U/

如果您对哪个键码

是哪个键码有疑问，函数中的哪个console.log(charCode);将帮助您进行调试。

（另请注意，捕获键事件不足以防止输入无效数据，因为用户可以使用浏览器的编辑菜单或拖放来更改字段。

试试这个 

  function isNumberKey(evt)
  {
     var charCode = (evt.which) ? evt.which : event.keyCode
     if (charCode != 45  && charCode > 31 && (charCode < 48 || charCode > 57))
        return false;
     return true;
  }

在网页中 

<input type="text" onkeypress="return isNumberKey(event)">

您希望使用破折号的字符代码，即 45，而不是键码。

此代码仅适用于数字类型

<input onkeypress="return isNumberKey(event);">
<script>
function isNumberKey(evt)
{
   var t = (evt.which) ? evt.which : event.keyCode;
     return !(t > 31 && (t < 48 || t > 57))
}
</script>

这是我问的时候提出的，所以可能值得在这里补充一点，keyCode和charCode被弃用，就像目前一样。

添加检查或实现也接受"-"字符的isNumberKey函数的更好方法是：

const isNumberKey = (event: KeyboardEvent) => 
   ((event.key.length > 1) || event.key.match(/^'d|-$/))

这样，我们检查允许特殊键执行其功能，同时确保在按下单个字符键时只允许数字。

这不适用于移动设备。例如，当输入类型设置为 "number" 时，Android 上的 Chrome 将调出数字键盘而不是全键盘。您可以尝试改用input type="tel"。它将允许数字0-9、-和()。它还会在Android上调出拨号盘。尚未在iPhone上测试过。

相关文章：