Javascript 如何在jQuery'；什么是按键事件？

我正在编写一些jQuery，它截取输入字段中输入的值，并确定是允许还是阻止键入的值

我需要获得下一个值，即，如果我允许按键，该值将是多少，并且我需要在显示前的某个点知道该值，因此我使用

keypress

事件

我的问题是：在

keypress

事件中，如果允许按键，我如何判断结果值？“潜在价值”是什么

如果我将按键事件对象写入控制台并检查属性，我可以看到

currentTarget.value

显示此“潜在值”。但是，如果在

keypress

事件中使用此属性，则它只返回上下文按键之前的值

例如，如果用户在绑定到以下jQuery的空文本框中键入“a”

$(":input").on("keypress", function(e) {
    console.log(e);
    console.log(e.currentTarget.value);
});

深入查看第一个控制台输出（

e

）显示

currentTarget.value

=“a”

但是第二个控制台输出（

e.currentTarget.value

）将显示“”

如果用户随后要在同一文本框中键入“b”，则： 手动检查

e

并定位

currentTarget.value

显示“ab”；从事件内部转储

e.currentTarget.value

显示“a”

---

有人能解释一下我是如何在

keypress

事件中获得这个“潜在值”的吗？

不是最漂亮的解决方案（你可以在恢复之前看到结果），而是为了省去分辨箭头/控制键和输入键等的麻烦，如果需要，您可以将原始值存储在

keypress

中，并恢复到

keyup

中的值（还可以存储选择位置以进行完全恢复）

范例

编辑

做了一些测试，但是jquery使得预测结果相对容易。它不仅填充key属性，还填充其事件上的其他属性，在这些属性上可以检查key的类型。而测试“非输入”键的charCode似乎为0。 直截了当的做法是：

$(":input").keypress(function(e) {
    if(!e.charCode)return; //is 0 for non input
    var cur = this.value; //current value
    var val = cur.substring(0,this.selectionStart)
        + e.key
        + cur.substring(this.selectionEnd);     
    return cur=== val //unchanged
        || somevalidation(val);        
});

但这不包括删除/退格，以处理这些问题：

$(":input").keypress(function(e) {
    var key,start = this.selectionStart ,end = this.selectionEnd;
    if(e.charCode)
        key = e.key;
    else{
        if(e.keyCode===8 || e.keyCode===46){
            key = '';
            if(end===start){
                if(e.keyCode===8)
                    start--;
                else
                    end++;
            }
        }
        else
            return true; //charCode is 0 for non input 46 = delete 8 = backspace
    }
    var cur = this.value; //current value
    var val = cur.substring(0, start) + key + cur.substring(end);     
    return cur=== val //unchanged
        || somevalidation(val);        
});

---

在测试过程中，这似乎表现出了预期的效果。另一种方法可能是有一个隐藏的输入字段，将键发送到那里并检查其结果，但上面的方法应该可以做到。

this.value+String.fromCharCode（e.charCode）

，它假定已附加了最新的添加内容。如果用户使用箭头键或单击字符串中间，然后输入一个字符，该怎么办？如果用户要从文本字段的任何位置删除一个字符怎么办？这就是为什么它是注释而不是答案。显然要处理的案件更多，这很难做到。仅通过鼠标操作（拖动、复制、粘贴、剪切、删除）即可更改文本，几个键具有特殊效果，例如

Del

，

BS

，

Ctrl+X

，

Ctrl+V

，

Shft+Del

，

Shft+INS

。。。为了处理所有这些情况，您可能会得到一段相当大的代码，试图模仿浏览器在处理事件时的操作。我认为让用户按照预期操作文本框更方便用户。你不想让他们认为键盘上的一个键坏了。在我看来，最好在不阻止标准输入的情况下，给出当前内容是否有效的视觉指示。我喜欢这种方法。在

keyup

发生之前，您是否可以改进以处理多个

keypress

事件？还有一个轻微的负面影响是撤销序列会被扭曲，但我同意这远比试图预测最终结果并在验证失败时取消按键要好。这是一个有效的答案，我感谢您的努力（so+1），但按下的键的暂时可见性是不可取的。明白了，我想如果可以看到发生了一些事情，但这是不允许的，那么这可能是用户友好的@trincot在撤销序列方面也有很好的观点。无论如何，再看一眼，添加了一个防止按键的版本。@Me.Name:您正在编写这样的自定义控件：-）@awj，Me.Name负责箭头键，在MDLE中进行选择，等等，这不是问题。另外，应该公开完整字符串的当然不应该是jQuery。如果有的话，应该由浏览器来完成，因为浏览器实际上“计算”了用户输入的总体效果。

$(":input").keypress(function(e) {
    var key,start = this.selectionStart ,end = this.selectionEnd;
    if(e.charCode)
        key = e.key;
    else{
        if(e.keyCode===8 || e.keyCode===46){
            key = '';
            if(end===start){
                if(e.keyCode===8)
                    start--;
                else
                    end++;
            }
        }
        else
            return true; //charCode is 0 for non input 46 = delete 8 = backspace
    }
    var cur = this.value; //current value
    var val = cur.substring(0, start) + key + cur.substring(end);     
    return cur=== val //unchanged
        || somevalidation(val);        
});