e.which key codes
Key Codes at the press of a... key
HTML
<table>
<thead>
<tr>
<th>
<label for="inpKey">Type Here</label>
<input id="inpKey" class="ui-corner-all" placeholder="type here" />
</th>
<th>
<p>Keypress</p>
</th>
<th>
<p>Keyup</p>
</th>
<th>
<p>Keydown</p>
</th>
</tr>
</thead>
<tbody>
<tr id="trActual">
<td>
<p>E.Which:</p>
</td>
<td>
<p class="keypress">--</p>
</td>
<td>
<p class="keyup">--</p>
</td>
<td>
<p class="keydown">--</p>
</td>
</tr>
</tbody>
</table>
CSS
tr {
padding: .25em;
}
td {
padding: .2em;
text-align: center;
}
label {
display: block;
}
input {
width: 80%;
text-align: center;
}
.ui-corner-all {
-moz-border-radius: 1em;
-webkit-border-radius: 1em;
border-radius: 1em;
}
JavaScript
$(function() {
console.log("ewhich object:\t", ewhich);
$("#inpKey").on("keyup", function(e) {
$("#trActual .keyup").text(e.which);
while ($(this).val().length > 1) {
$(this).val($(this).val().substr($(this).val().length - 1));
};
});
$("#inpKey").on("keypress", function(e) {
$("#trActual .keypress").text(e.which);
});
$("#inpKey").on("keydown", function(e) {
$("#trActual .keydown").text(e.which);
});
}); /* BEGIN OBJECT */
var ewhich = {
mozilla: {
Arrows: {
left: 37,
up: 38,
right: 39,
down: 40
},
Control: {
BACKSPACE: 8,
TAB: 9,
ENTER: 13,
SHIFT: 16,
CTRL: 17,
ALT: 18,
PAUSE: 19,
CAPS: 20,
SPACE: 32,
PRTSCN: 44,
SCRLOK: 145
},
QWERTY: {
"0": 48,
1: 49,
2: 50,
3: 51,
4: 52,
5: 53,
6: 54,
7: 55,
8: 56,
9: 57,
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
},
NUMLOCK: {
"0": 96,
1: 97,
2: 98,
3: 99,
4: 100,
5: 101,
6: 102,
7: 103,
8: 104,
9: 105,
"*": 106,
"+": 107,
"-": 109,
".": 110,
"/": 111
},
...