Question

可能重复：
keydown event new value

找不到我正在寻找的答案，试了一会儿，绝望了：

我的目标是拥有一个数字非负输入字段，该字段可以是十进制的，并且具有单个字符后缀，即字母（存在legel后缀集合）。

在技术层面 - 我需要能够拒绝输入字符，我需要两个值（输入之前和之后）。

我试过的方法＆amp;失败：

Keydown \ Keypress活动：

无法获取“之后”，只有之前和char / KeyCode。这是一个问题，因为我不知道在旧值中插入新char的位置（最后不是必须...） - 需要一种方法来获取“之后”或至少是char所属的索引。

Keyup事件：

没有之前的值，但更糟糕的是 - 当长按（“00000000000000000 ...”）时这不会触发，因此我无法拒绝输入。

OnChange / change / blur - 仅在失去焦点时触发，而不是我需要的功能。

任何想法？

Answer 1

如何在隐藏字段中保存当前值并在必要时更新它？这将允许您访问“之前”和“之后”状态。

这不是一个好方法，但考虑到它几乎不可能获得之前的价值，我会考虑它。

Answer 2

我宁愿指出你的另一个方向。在早期的项目中我遇到了同样的问题。我通过使用jQuery插件来推动它。所谓的“蒙面输入”。

然后，您将能够正式表达用户应该如何输入该字段。

这是该插件的GitHup Ressource！ https://github.com/digitalBush/jquery.maskedinput

您可以找到示例和文档here！

一个例子：

jQuery(function($){
    $("#element-id").mask("9.99a");
});

有很多选择，只需查看创建自己的面具的能力！

Answer 3

很难知道onkeypress之后的价值是什么。是的，我们知道按下的键（和修饰符），我们知道选择/光标，因此我们可以模拟将发生的事情以及preventDefaultAction事件的keypress。但是我们假设键盘布局可能是错误的，并且有很多边缘情况输入方法我们几乎无法处理它们。

我想出的解决方案是手动维护输入的状态，并尽可能多地查找更改。如果发生这种情况，则使用previous和after状态触发处理程序并返回新值。这是看起来像：

function handler(afterval, prevval) {
    // do something
    return afterval; // return val can be used for length limits etc
}
(function(el, handler) {
    var curval = el.value;
    function check(e) {
        if (el.value != curval)
            curval = el.value = handler(el.value, curval);
    }
    $(el)
      .on("keyup input keydown change mouseup cut paste focus", check)
      .on("keypress", function(e) {
        check(e);
        setTimeout(check, 0); // also check after keypress as soon as possible
      });
})(handler);

使用keypress进行Javascript输入验证，获取值之前和之后

3 个答案: