如何在按键事件后获取 jQuery .val()？

Posted 2023-02-22

【中文标题】如何在按键事件后获取 jQuery .val()？

【英文标题】：How can I get jQuery .val() AFTER keypress event?

【发布时间】：2011-03-05 01:18:41

【问题描述】：

我明白了：

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

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

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

【问题讨论】：

如果文本被删除，按钮是否应该再次禁用？如果是这样，您可能不得不坚持使用按键。

【参考方案1】：

将keypress 更改为keyup：

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

keypress 在按键按下时触发，keyup 在按键松开时触发。

【讨论】：

@Brilliand 你是对的。我为此做了一个解决方法，它发布在下面。

你是如何在 iPhone/android 设备上完成这项工作的？他们不支持 keyup 功能。

按键定义不完全正确。这就是keydown的定义。见quirksmode.org/dom/events/keys.html

【参考方案2】：

惊讶地没有人提到js“输入”事件：

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

推荐。

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

【讨论】：

哇，这是几个未回答/回答不好的 SO 问题的答案。

当您需要忽略输入字段中的箭头键、shift 等时，这也很棒。

caniuse.com/#search=input 比较好的浏览器支持。比听每一个按键都要好得多。

它节省了我的时间！谢谢你。我使用了以下代码： $('.subject_mark').on("input", function () var $th = $(this); $th.val($th.val().replace(/[^ 0-9]/g, function (str) return ''; ));

【参考方案3】：

使用 keyup 代替按键。

【参考方案4】：

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

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

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

【讨论】：

在按住 Backspace 的情况下，这仍然会表现得很奇怪......也许按键超时为 0？

啊，没关系，OP没有指定如果清除文本字段会发生什么。

【参考方案5】：

试试这样的：

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

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

edit — 或者您可以像其他人所说的那样使用“keyup”，尽管它的语义不同。

【讨论】：

这不是善意的智能问题。 keyup 事件不提供相同的结果。您可以通过 keyup 获得 shift、ctrl 等不同的事件 - 如果您想获得正在输入的实际字符（例如 & 符号）而不是一系列键事件，您必须检查 shift 或 ctrl 键的状态，keypress是要走的路。

对；这就是我所说的“它的语义不同”。