Javascript 如何在按键事件后获得 jquery .val()?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3063434/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 03:09:27  来源:igfitidea点击:

How can I get jquery .val() AFTER keypress event?

javascriptjqueryeventsformsjavascript-events

提问by J?rg Brenninkmeyer

I got:

我有:

$(someTextInputField).keypress(function() {
  alert($(this).val());
});

Now the alert always returns the value BEFORE the keypress (e.g. the field is empty, I type 'a' and the alert gives me ''. Then I type 'b' and the alert gives me 'a'...). But I want the value AFTER the keypress - how can I do that?

现在警报总是在按键之前返回值(例如,该字段为空,我输入'a',警报给我''。然后我输入'b',警报给我'a'...)。但我想要按键后的值 - 我该怎么做?

Background: I'd like to enable a button as soon as the text field contains at least one character. So I run this test on every keypress event, but using the returned val() the result is always one step behind. Using the change() event is not an option for me because then the button is disabled until you leave the text box. If there's a better way to do that, I'm glad to hear it!

背景:我想在文本字段包含至少一个字符后立即启用按钮。所以我在每个按键事件上运行这个测试,但使用返回的 val() 结果总是落后一步。使用 change() 事件对我来说不是一个选项,因为在您离开文本框之前,该按钮将被禁用。如果有更好的方法来做到这一点,我很高兴听到它!

回答by Hooray Im Helping

Change keypressto keyup:

更改keypresskeyup

$(someTextInputField).on("keyup", function() {
  alert($(this).val());
});

keypressis fired when the key is pressed down, keyupis fired when the key is released.

keypress按下键时keyup触发,松开键时触发。

回答by billynoah

Surprised that no one mentioned the js "input" event:

很惊讶没有人提到js“输入”事件:

$(someTextInputField).on('input', function() {
  alert($(this).val());
});

Recommended.

受到推崇的。

https://developer.mozilla.org/en-US/docs/Web/Events/input

https://developer.mozilla.org/en-US/docs/Web/Events/input

回答by Kris van der Mast

instead of keypress, use keyup.

而不是按键,使用keyup

回答by David Oliveros

Alternatively, you can use the keydown event with a timeout of 0.

或者,您可以使用超时为 0 的 keydown 事件。

That way, the changes will be applied instantly, instead of being applied when the user stops holding the key.

这样,更改将立即应用,而不是在用户停止按住键时应用。

$(someTextInputField).on("keydown", function() {
  setTimeout(function($elem){
    alert($elem.val());
  }, 0, $(this));
});

回答by Pointy

Try something like this:

尝试这样的事情:

$('#someField').keypress(function() {
  setTimeout(function() {
    if ($('#someField').val().length > 0)
      $('#theButton').attr('disabled', false);
  }, 1);
});

That simply introduces a timeout so that after the "keypress" event loop completes, your code will run almost immediately thereafter. Such a short timer interval (even if rounded up by the browser) will not be noticeable.

这只是引入了超时,以便在“按键”事件循环完成后,您的代码将在此后几乎立即运行。如此短的计时器间隔(即使被浏览器四舍五入)也不会引起注意。

edit— or you coulduse "keyup" like everybody else says, though its semantics are different.

编辑——或者你可以像其他人说的那样使用“keyup”,尽管它的语义不同。

回答by Stephen P

You may want to hook up an onchangeevent handler instead of using any of the key events.

您可能希望连接一个onchange事件处理程序,而不是使用任何关键事件。

$(someTextInputField).change(function() {
    alert($(this).val());
});

Using Edit > Pasteor a Right-Click then Paste will fire a change event, but not a key event. Note somebrowsers may simulate a key event on a paste (though I don't know of any) but you can't count onthat behavior.

使用Edit > Paste或 右键单击​​然后粘贴将触发更改事件,但不会触发关键事件。请注意,某些浏览器可能会在粘贴时模拟关键事件(尽管我不知道任何事件),但您不能指望这种行为。