上发条对上发条

这三件事有什么不同?在谷歌上我发现:

当用户按下一个键时，onKeyDown事件被触发。当用户释放密钥时触发onKeyUp事件。当用户按下并释放一个键时触发onKeyPress事件 (onKeyDown紧接着onKeyUp)。

我理解前两个，但不是onKeyPress相同的onKeyUp?是否有可能释放一个键(onKeyUp)而不按它(onKeyDown)?

这有点混乱，有人能帮我解释一下吗?

当前回答

“KeyPress”现已弃用。请使用KeyDown键。

KeyPress, KeyUp和KeyDown分别类似于:Click, MouseUp和MouseDown。

先下第二个按键发生(当输入文本时) Up发生在最后(当文本输入完成时)。

webkit是个例外，它有一个额外的事件:

keydown
keypress
textInput     
keyup

下面是一个片段，你可以自己看看什么时候事件被触发:

窗口。addEventListener(“弹起”,日志); 窗口。addEventListener(“键盘按键”,日志); 窗口。addEventListener(“keydown”、日志); 对数函数(事件){ console.log(事件。类型); ｝

2010-08-03 13:16:28

其他回答

这里的大多数答案更多地集中在理论而不是实际问题上，至少在Firefox中(在43中测试)，keyup和keypress在输入字段值方面有一些很大的区别。

如果用户在空的输入元素中输入1:

input元素的值将是按键处理程序中的空字符串(旧值) 在keyup处理程序中，input元素的值将是1(新值)。

如果您所做的工作依赖于知道输入后的新值，而不是当前值，例如内联验证或自动制表符，那么这一点至关重要。

场景:

用户在输入元素中输入12345。用户选择文本12345。用户输入字母A。

当输入字母A后触发按键事件时，文本框现在只包含字母A。

But:

Field.val()是12345。美元Field.val()。长度为5 用户选择是一个空字符串(防止您通过覆盖选择来确定删除了什么)。

这样看来，浏览器(Firefox 43)擦除用户的选择，然后触发按键事件，然后更新字段内容，然后触发keyup。

2017-02-04 05:45:51

似乎onkeypress和onkeydown做的是一样的(在上面已经提到的快捷键的小差异中)。

你可以试试这个:

<textarea type="text" onkeypress="this.value=this.value + 'onkeypress '"></textarea>
<textarea type="text" onkeydown="this.value=this.value + 'onkeydown '" ></textarea>
<textarea type="text" onkeyup="this.value=this.value + 'onkeyup '" ></textarea>

你会看到onkeypress和onkeydown事件都是在按下键时触发的，而不是在按下键时触发的。

不同之处在于，事件不是一次触发，而是多次触发(只要您按住键)。要意识到这一点，并相应地处理它们。

2012-05-27 21:10:48

一些实际的事实可能有助于决定要处理哪个事件(运行下面的脚本并关注输入框):

“输入”(美元)。上(“钥匙键盘”，e=>控制台。打字，e.keyCode, e. yg, e.key) <剧本剧本src = " https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js " > < / > 输入< - >

压:

非插入/键入键(例如Shift, Ctrl)将不会触发按键。按Ctrl并释放它: 按键17 17控制按键17 17控制将字符转换应用到其他字符的键盘上的键可能会导致死键和重复的“键”(例如~，´)。按´并释放它，以显示双重´´: 死亡192 按键192 192´´ 按键180°180° 按键180°180° 死了192

此外，非键入输入(例如，rang <input type="range">)仍然会根据按下的键触发所有的keyup, keydown和keypress事件。

2019-09-13 17:46:26

答:更新

KeyDown

当你按住键时，会触发多次。触发元键。

键盘按键

当你按住键时，会触发多次。不触发元键。

KeyUp

当你释放钥匙时，最后会触发一次。触发元键。

这是addEventListener和jQuery中的行为。

https://jsbin.com/vebaholamu/1/edit?js,console,output <——试试例子

(答案已编辑正确的回答，截图和示例)