通过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语句中的charCode > 48 || charCode < 57 ，则实际上始终返回true。 这是因为每一个数字比48大或小于57.我想|| 应该是&& 。 另外，数字的最小KeyCode是48，如果替换||则不包括在内。 与&& 。 数字最大的KeyCode都不是57。

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

编辑：如前所述，您必须用evt.preventDefault()代替return false 。

此功能应该起作用：

 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(); }