有人能解释一下为什么numpad keyup和keydown事件返回不同的键值吗?
考虑一下:
<input type="text" />
<script>
document.getElement('input').addEvents({
'keydown':function(e){
console.log('keydown: code:' + e.code + ', key:' + e.key);
},
'keyup':function(e){
console.log('keyup : code:' + e.code + ', key:' + e.key + 'n');
}
});
</script>
我期望每个事件都为keydown和keyup返回相同的键值，但相反，我得到了下面的输出(在按下0、1、2、8和9之后):
keydown: code:96, key:0
按键:代码:96，按键:'keydown: code:97, key:1
键up:代码:97，键:akeydown: code:98, key:2
键盘:代码:98，按键:bkeydown: code:104, key:8
按键:代码:104，按键:hkeydown: code:105, key:9
键盘:代码:105，按键:i
通常我会使用按键，因此，从来没有出现过任何问题。当我在键盘上按下相应的numpad键时，在屏幕上高亮显示numpad代表按钮时遇到了这个问题(向下高亮，向上高亮删除)。
任何想法?
不同的浏览器如何实现keydown, keypress和keyup事件存在很大的混乱，甚至keydown和keyup事件中的keyCode值还没有跨浏览器标准化。
当前事件对象有三个属性，包含按下的键的信息:
- charCode -按下的字符键的Unicode值
- keyCode—表示用户按下的键的数字
- which -按下的字母数字键的keyCode或charCode编号
按下的键值存储在keyCode或charCode属性中，但从不同时存储，keyCode总是在keydown和keyup事件中设置，charCode在keypress事件中设置。
所以，例如，如果你按下'e':
- keydown和keyup报告:
- charCode=0, keyCode=69，其中=69 -第69位字符为大写字母E
- 按键响应报告:
- charCode=101, keyCode=0，其中=101 - 101号字符为小写字母e
如果你按下numpad中的数字9:
- keydown和keyup报告:
- charCode=0, keyCode=105, which=105 -数字105处的字符为小写字母i
- 按键响应报告:
- charCode=57, keyCode=0，这=57 -字符在数字57是数字9
Mootools
Mootools试图通过添加事件来使事情标准化。代码和事件。关键属性:
event.code = event.which || event.keyCode;
event.key = String.fromCharCode(code).toLowerCase();
它还转换numpad上的数字的keyCodes，但仅用于keydown事件(版本1.4.5)，而不用于keyup。我不知道这是否有意或无意，但keyup事件可以很容易地修改为具有相同的行为，通过替换mootools-core-1.4.5-full-nocompat.js中的1163行:
if (type == 'keydown') {
:
if (type == 'keydown' || type == 'keyup') {
这样keyup事件中的keyCodes也会被转换。
有趣的是，Mozilla开发者网络说:
'charCode'， 'keyCode'和'which'已弃用，如果可用，您应该使用'char'或'key'代替。
但是我还没有在Firefox或Chrome中看到这个实现。jQuery为事件对象添加了' key '属性，但它总是'undefined'(可能取决于浏览器的实现)。
在监听keydown和keyup事件时使用e.code而不是e.key。E.key只对按键事件可靠。
:
- http://mootools.net/docs/core/Types/DOMEvent
- http://www.quirksmode.org/js/keys.html