We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
开发者_StackOverflow中文版Closed 6 years ago.
Improve this questionI know this is probably going to be in vain but I want to see if there is an answer. I'm making an HTML5 game and I'm trying to get keyboard input. Please tell me someone knows something google doesn't. Hopefully at least it'll stress how much keyboard events and keycodes need to be made more cross-browser.
Please tell me there is some kind of object in the javascript api that lists each key's keycode. And if not, why hasn't it been done yet, just being able to grab a key's code would make our jobs so much easier. No more testing the inconsistencies per browser/os.
And if not that (this is probably more in vain) is there a way to redefine the default keycodes to our own custom keycodes?
I don't know why more work hasn't been done to make this more convenient?
I find this page to be very helpful. Also quirks mode has a good article on it. Fact of the matter is that there's browser inconsistencies and a javascript framework like jQuery help with that.
JavaScript does not include a built-in hash of keycode-to-keyname pairings.
It's largely unnecessary because JS uses the same keycodes as are reported by the Operating System. Adding a hash would only hinder the performance unnecessarily.
The program doesn't need to know what the name of the key was, it just needs to know what action to take.
Instead of writing code like:
if (e.keyCode === customKeyList.UP)
{
doUp();
}
You can simply set your own hash of actions:
//before the event
actions = {
'38': function () {
//do UP stuff here
},
'40': function () {
//do DOWN stuff here
}
};
//during the event
if (actions[e.keyCode]) {
actions[e.keyCode]();
}
At no point in that example is it necessary for the computer to know the name of the key, but for convenience it may be useful to write it as:
actions[keys.UP] = function () {...};
actions[keys.DOWN] = function () {...};
but you'll need to define your own keycode-to-keyname pairing object.
I recently discovered that jQuery UI has a list of some commonly used keycodes ($.ui.keyCode
):
keyCode: {
ALT: 18,
BACKSPACE: 8,
CAPS_LOCK: 20,
COMMA: 188,
COMMAND: 91,
COMMAND_LEFT: 91, // COMMAND
COMMAND_RIGHT: 93,
CONTROL: 17,
DELETE: 46,
DOWN: 40,
END: 35,
ENTER: 13,
ESCAPE: 27,
HOME: 36,
INSERT: 45,
LEFT: 37,
MENU: 93, // COMMAND_RIGHT
NUMPAD_ADD: 107,
NUMPAD_DECIMAL: 110,
NUMPAD_DIVIDE: 111,
NUMPAD_ENTER: 108,
NUMPAD_MULTIPLY: 106,
NUMPAD_SUBTRACT: 109,
PAGE_DOWN: 34,
PAGE_UP: 33,
PERIOD: 190,
RIGHT: 39,
SHIFT: 16,
SPACE: 32,
TAB: 9,
UP: 38,
WINDOWS: 91 // COMMAND
}
You can find the key bindings for most browsers by capturing a keypress and examining the event object- it may have a set of virtual key bindings.
Mozilla returns this set-
Property Value
CANCEL= 3
HELP= 6
BACK_SPACE= 8
TAB= 9
CLEAR= 12
RETURN= 13
ENTER= 14
SHIFT= 16
CONTROL= 17
ALT= 18
PAUSE= 19
CAPS_LOCK= 20
KANA= 21
HANGUL= 21
JUNJA= 23
FINAL= 24
HANJA= 25
KANJI= 25
ESCAPE= 27
CONVERT= 28
NONCONVERT= 29
ACCEPT= 30
MODECHANGE= 31
SPACE= 32
PAGE_UP= 33
PAGE_DOWN= 34
END= 35
HOME= 36
LEFT= 37
UP= 38
RIGHT= 39
DOWN= 40
SELECT= 41
PRINT= 42
EXECUTE= 43
PRINTSCREEN= 44
INSERT= 45
DELETE= 46
0= 48
1= 49
2= 50
3= 51
4= 52
5= 53
6= 54
7= 55
8= 56
9= 57
SEMICOLON= 59
EQUALS= 61
A= 65
B= 66
C= 67
D= 68
E= 69
F= 70
G= 71
H= 72
I= 73
J= 74
K= 75
L= 76
M= 77
N= 78
O= 79
P= 80
Q= 81
R= 82
S= 83
T= 84
U= 85
V= 86
W= 87
X= 88
Y= 89
Z= 90
CONTEXT_MENU= 93
SLEEP= 95
NUMPAD0= 96
NUMPAD1= 97
NUMPAD2= 98
NUMPAD3= 99
NUMPAD4= 100
NUMPAD5= 101
NUMPAD6= 102
NUMPAD7= 103
NUMPAD8= 104
NUMPAD9= 105
MULTIPLY= 106
ADD= 107
SEPARATOR= 108
SUBTRACT= 109
DECIMAL= 110
DIVIDE= 111
F1= 112
F2= 113
F3= 114
F4= 115
F5= 116
F6= 117
F7= 118
F8= 119
F9= 120
F10= 121
F11= 122
F12= 123
F13= 124
F14= 125
F15= 126
F16= 127
F17= 128
F18= 129
F19= 130
F20= 131
F21= 132
F22= 133
F23= 134
F24= 135
NUM_LOCK= 144
SCROLL_LOCK= 145
COMMA= 188
PERIOD= 190
SLASH= 191
BACK_QUOTE= 192
OPEN_BRACKET= 219
BACK_SLASH= 220
CLOSE_BRACKET= 221
QUOTE= 222
META= 224
The keycodes.js and keyhandler.js classes from Google Closure library have a list of many key codes and useful comments about differencies across different browsers.
精彩评论