Javascript字符限制-临时显示无效字符

我正在使用Javascript限制各种文本输入字段的字符，作为客户端验证的一种形式，并提高了可用性。我正在使用以下代码执行此操作：

function validNumbers(caller) {
    var exp = /^[\d.]+/g;
    var str = '';
    if (caller.value.match(exp)) {
        str = caller.value.match(exp).toString();
    } else {
        str = '';
    }
    str = str.replace(/\D/g,'');
    caller.value = str;
}

我使用onkeypress=“validNumbers（this）；”调用此函数，并且在大多数情况下，它的工作方式就像一个符咒。问题是，当我在字段中键入一个无效字符时，字段的值似乎得到了更新（从Javascript的角度来看），但该字符会一直保留，直到我点击下一个键为止，在这一点上，它会在视觉上被下一个键的值替换，即使下一个键也是无效的。理想的效果是，当按下无效键时，无效值甚至不会在视觉上显示出来。我如何做到这一点

---

编辑：我选择了下面的答案，因为它让我走上了正确的轨道。我确实必须确保将e.shiftKey添加到我的排除事件列表中，以防止出现“！@$%^&*（）\”之类的字符，但这不是我自己要解决的问题。

在函数中，在将值输入文本字段并进行计算后，您将清除该值。相反，您需要防止它被输入到文本字段中。要完成此操作，您需要使用向下键的

preventDefault（）

方法：

onkeydown="function(e) { validNumbers(e); }"

function validNumbers(e) {
    if (e.keyCode == 1 || e.keyCode == 2 ... etc) {
        e.preventDefault();
    }
}

这将阻止特定字符（）进入输入字段。请注意，这不会阻止复制和粘贴，因此您仍然需要计算整个字符串“onpaste”，或者使用类似的事件处理程序阻止“onpaste”

---

这也不是一个跨浏览器的解决方案，但应该让你的脚充分湿润。查看此示例。

逐个字符限制用户输入是一种反可用性功能。告诉用户您在字段中想要什么（例如屏幕上显示的“仅限数字”或类似提示），然后在合理的时间（比如提交表单时）验证，这会更有帮助。让他们担心如何获得有效值。我将进行服务器端验证，但通过限制可以在文本字段中放置的字符，我可以节省他们的时间，因为我可以让他们省去返回表单以搜索一个明显的问题的需要，而我可以更轻松地为他们解决这个问题。如果我简单地允许他们输入他们想要的任何内容，他们就不会立即得到关于哪些有效，哪些无效的反馈，这可能意味着在所有文本字段中搜索一个无效字符。时间问题是这个项目的最大焦点，因为他们将使用这些表单，有时每天数百次。您还有其他选择，例如在输入无效字符时在输入周围放置红色边框。我发现当字符输入受到限制时，我意外地输入了一个无效字符，我按delete键将其删除，但聪明的程序员已经这样做了，所以我删除了一个有效字符。我如何找到那个错误？另外，如何停止粘贴或拖放无效字符？我很确定您可以将：

“function（e）{validNumbers（e）；}”

更改为

“validNumbers”