javascript - 仅允许数字输入而不通过 addEventListener 返回 false 的函数

Question

在我的外部 JS 文件中，我有以下代码来禁用用户的非数字输入:

function numericInput(evt) {
   var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode > 48 || charCode < 57)
    {
        return true;
    } 
    else 
    {
       return false;
    }
 }

我想通过 addEventListener 添加此函数，我执行了以下操作:

document.getElementById("myTextbox").addEventListener("keypress", function (evt) {
    numericInput(evt);
}, false);

我做错了什么？

Answer 1

部分charCode > 48 || charCode < 57在你的 if 语句中，实际上总是返回 true。这是因为每个数字都大于48或小于57。我认为||应该是&& 。另一件事，数字的最小 KeyCode 是 48，如果替换 || 则不包括在内。与 && 。数字的最大 KeyCode 57 两者都不是。

我认为如果您替换charCode > 48 || charCode < 57，您的代码将正常工作与 charCode >= 48 && charCode <= 57 .

编辑: 正如 Adeneo 之前提到的，你必须替换 return false与 evt.preventDefault() .

这个函数应该可以工作:

function numericInput(evt) {
   var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode >= 48 && charCode <= 57)
    {
        return true;
    } 
    else 
    {
       evt.preventDefault();
    }
 }

/*    OR:    */


function numericInput(evt) {
  var charCode = (evt.which) ? evt.which : event.keyCode
    if (charCode < 48 || charCode > 57) evt.preventDefault();
 }