jQuery获得按键后的input值

我有以下function：

$(document).ready(function() { $("#dSuggest").keypress(function() { var dInput = $('input:text[name=dSuggest]').val(); console.log(dInput); $(".dDimension:contains('" + dInput + "')").css("display","block"); }); }); 

出于某种原因，对于第一个按键，我得到一个空string的控制台日志。

Answer 1

这是因为在将新字符添加到元素的value之前触发keypress事件（因此在添加第一个字符之前触发第一个keypress事件，而该value仍为空）。 您应该使用keyup ，而在添加字符后触发。

请注意，如果您的元素#dSuggest与input:text[name=dSuggest]相同input:text[name=dSuggest] ，则可以相当简化此代码（如果不是，则具有名称与另一元素的id相同的元素不是一个好主意）。

 $('#dSuggest').keypress(function() { var dInput = this.value; console.log(dInput); $(".dDimension:contains('" + dInput + "')").css("display","block"); }); 

Answer 2

意识到这是一个相当古老的post，无论如何我会提供一个答案，因为我正在同样的问题挣扎。

您应该使用"input"事件，并使用.on方法注册。 这是快速的 – 没有keyup的滞后，并解决你所描述的失踪的最新按键问题。

 $('#dSuggest').on("input", function() { var dInput = this.value; console.log(dInput); $(".dDimension:contains('" + dInput + "')").css("display","block"); }); 

在这里演示

Answer 3

使用.keyup而不是按键。

也可以使用$(this).val()或者this.value来访问当前的input值。

在这里演示

有关jQuery文档中.keypress信息，

当浏览器注册键盘input时，keypress事件被发送到一个元素。 这与keyydown事件类似，除了关键重复的情况。 如果用户按下并保持一个键，则触发按键事件一次，但是对于每个插入的字符触发单独的按键事件。 此外，修饰键（如Shift）触发keydown事件，但不是按键事件。

Answer 4

您必须中断执行线程以允许input更新。

  $(document).ready(function(event) { $("#dSuggest").keypress(function() { //Interrupt the execution thread to allow input to update setTimeout(function() { var dInput = $('input:text[name=dSuggest]').val(); console.log(dInput); $(".dDimension:contains('" + dInput + "')").css("display","block"); }, 0); }); }); 

Answer 5

这是因为Keypress事件是在添加新字符之前触发的。 使用“keyup”事件，这将完全适合您的情况。

 $(document).ready(function() { $("#dSuggest").keyup(function() { var dInput = $('input:text[name=dSuggest]').val(); console.log(dInput); $(".dDimension:contains('" + dInput + "')").css("display","block"); }); }); 

我想补充一点，如果你有很多文本框，你必须在它们的keyup事件上做同样的事情，你可以给它们一个普通的css类（例如commoncss），并应用这样的keyup事件。

 $(document).ready(function() { $(".commoncss").keyup(function() { //your code }); }); 

这将大大减less您的代码，因为您不必通过id为每个文本框应用keyup事件。

Answer 6

我正在寻找一个ES6的例子（所以它可以通过我的棉绒）所以对于其他人正在寻找相同的：

 $('#dSuggest').keyup((e) => { console.log(e.currentTarget.value); }); 

我也会使用keyup，因为你得到了当前填充的值。

Answer 7

我想你需要的是下面的原型

 $(element).on('input',function(){code})