-->

检测文本字段中的keydown事件后,输入文本字段的“价值”?(Detecting “value”

2019-07-03 19:47发布

所以,我的网站有一个输入框,它具有只是提醒输入框的值的onkeydown事件。

不幸的是,输入的数值不包括由于被按下的键的变化。

例如,对于这个输入框:

<input onkeydown="alert(this.value)" type="text" value="cow" />

默认值是“牛”。 当您按下“S”键输入,你会得到一个警报(“牛”),而不是警报(“牛”)。 我怎样才能使它提醒(“牛”),而不使用的onkeyup? 我不希望使用的onkeyup,因为感觉不太敏感。

一个部分解决方案是检测按下的键,然后将其添加到输入的数值,但这并不所有的情况下工作,例如,如果你有在输入文本高亮,然后按下一个键。

任何人有这个问题的完整解决方案?

谢谢

Answer 1:

事件处理程序只看到改变前的内容应用,因为mousedowninput事件给你一个机会来阻止事件在其到达前场。

您可以解决此限制通过给浏览器有机会抓住它的值之前更新字段的内容 - 最简单的方法是检查值之前,使用一个小的超时。

一个最小的例子是:

<input id="e"
    onkeydown="window.setTimeout( function(){ alert(e.value) }, 1)"
    type="text" value="cow" />

这将设置一个1ms的超时按键和的keydown处理之后已经让控制来改变它的值应该发生的。 如果您的显示器以60fps的刷新则落后2帧之前你有余地为16ms。


更完整的例子(不依赖于窗口对象命名访问将如下所示:

 var e = document.getElementById('e'); var out = document.getElementById('out'); e.addEventListener('input', function(event) { window.setTimeout(function() { out.value = event.target.value; }, 1); }); 
 <input type="text" id="e" value="cow"> <input type="text" id="out" readonly> 

当你运行上面的代码中,尝试一些如下:

  • 把光标开始和类型
  • 粘贴在文本框中的中间部分内容
  • 选择一大堆文字和类型来代替它


Answer 2:

请注意,在新的浏览器,你就可以使用新的HTML5“输入”事件( https://developer.mozilla.org/en-US/docs/DOM/window.oninput )这一点。 (见链接兼容性表)大多数非IE浏览器都支持本次活动时间长; IE浏览它的版本> / 9只不幸。



Answer 3:

KEYUP /向下事件在不同的浏览器不同的处理。 简单的解决方法是使用喜欢Moot,这将使他们的行为相同,应对传播和起泡库,并给你一个标准的回调“本”。



Answer 4:

据我所知,除非你滚你自己的,你不能这样做,有一个标准的输入控制。



Answer 5:

在这里,你有例子与解释: http://jsbin.com/awopus/4/edit



Answer 6:

请尝试oninput事件中使用。 不同onkeydown,onkeypress 事件事件这一事件更新控件的值属性。

<input id="txt1" value="cow" oninput="alert(this.value);" />


Answer 7:

jQuery是这样做的最佳方式。 请参考下以下几点:

let fieldText = $('#id');
let fieldVal = fieldText.val();

fieldText.on('keydown', function() {
   fieldVal.val();
});


文章来源: Detecting “value” of input text field after a keydown event in the text field?