Html 如何在 onKeyPress 期间获取输入文本框的文本

当用户在文本框中输入文本时，我try 将文本输入其中(jsfiddle playground):

function edValueKeyPress() {
    var edValue = document.getElementById("edValue");
    var s = edValue.value;

    var lblValue = document.getElementById("lblValue");
    lblValue.innerText = "The text box contains: " + s;

    //var s = $("#edValue").val();
    //$("#lblValue").text(s);    
}

<input id="edValue" type="text" onKeyPress="edValueKeyPress()"><br>
<span id="lblValue">The text box contains: </span>

​ 代码运行时没有错误，只是在onKeyPress个个期间input text框的value始终是更改后的值before:

Question:如何在onKeyPress个个期间获取文本框的文本？

花言巧语

HTML DOM中有三个与"the user is typing"相关的事件:

• onKeyDown个个个个
• onKeyPress个个
• onKeyUp个个

在Windows中，当用户按住一个键并且该键开始重复时，WM_Key条消息的顺序变得重要:

• WM_KEYDOWN('a')-用户已按下A键
• WM_CHAR('a')--已收到来自用户的a个字符
• WM_CHAR('a')--已收到来自用户的a个字符
• WM_CHAR('a')--已收到来自用户的a个字符
• WM_CHAR('a')--已收到来自用户的a个字符
• WM_CHAR('a')--已收到来自用户的a个字符
• WM_KEYUP('a')-用户已释放键

将导致文本控件中出现五个字符:aaaaa

重要的一点是，你要回复WM_CHAR条信息，也就是重复的那条信息.否则，当按下某个键时，您会错过事件.

在HTML种情况下，情况略有不同:

• onKeyDown个个个个
• onKeyPress个个
• onKeyDown个个个个
• onKeyPress个个
• onKeyDown个个个个
• onKeyPress个个
• onKeyDown个个个个
• onKeyPress个个
• onKeyDown个个个个
• onKeyPress个个
• onKeyUp个个

HTML每按一次键就会重复KeyDown次和KeyPress次.并且仅当用户松开键时才引发KeyUp事件.

Take aways个

• I can respond to onKeyDown个个个个 or onKeyPress个个, but both are still raised before the input.value has been updated
• I cannot respond to onKeyUp个个, because it doesn't happen as the text in the text-box changes.

Question:如何在onKeyPress个个期间获取文本框的文本？

额外阅读

• Getting a form value with jQuery个
• Get the value in an input text box个