Detecting Keyboard Codes with Javascript
Javascript is frequently used on client side browsers (this means you and ) to perform simple tasks that would otherwise require a full postback to the server. In many cases, it is necessary to know the keyboard code associated with characters and/or text that is entered into a form element on a web page in order to process the request. If you would like to use this code, simply click on code box to copy the code to clipboard.
As a courtesy, you can copy the code to your clipboard by clicking inside the code box. Or you can download the file: gzip zip uncompressed.
Javascript Event (key code)
Code: Javascript
- /* Filename: keycodes.js
- ----------------------------------------*/
- var keycodes = new Array();
- function get_keyboard_codes() {
- keycodes = {
- 8 : "backspace",
- 9 : "tab",
- 13 : "enter",
- 16 : "shift",
- 17 : "ctrl",
- 18 : "alt",
- 19 : "pause/break",
- 20 : "caps lock",
- 27 : "escape",
- 33 : "page up",
- 34 : "page down",
- 35 : "end",
- 36 : "home",
- 37 : "left arrow",
- 38 : "up arrow",
- 39 : "right arrow",
- 40 : "down arrow",
- 45 : "insert",
- 46 : "delete",
- 91 : "left window",
- 92 : "right window",
- 93 : "select key",
- 96 : "numpad 0",
- 97 : "numpad 1",
- 98 : "numpad 2",
- 99 : "numpad 3",
- 100 : "numpad 4",
- 101 : "numpad 5",
- 102 : "numpad 6",
- 103 : "numpad 7",
- 104 : "numpad 8",
- 105 : "numpad 9",
- 106 : "multiply",
- 107 : "add",
- 109 : "subtract",
- 110 : "decimal point",
- 111 : "divide",
- 112 : "F1",
- 113 : "F2",
- 114 : "F3",
- 115 : "F4",
- 116 : "F5",
- 117 : "F6",
- 118 : "F7",
- 119 : "F8",
- 120 : "F9",
- 121 : "F10",
- 122 : "F11",
- 123 : "F12",
- 144 : "num lock",
- 145 : "scroll lock",
- 186 : ";",
- 187 : "=",
- 188 : ",",
- 189 : "-",
- 190 : ".",
- 191 : "/",
- 192 : "`",
- 219 : "[",
- 220 : "\\",
- 221 : "]",
- 222 : "'"
- };
- return keycodes;
- }
- function detect_keycode(event) {
- var L_CODEOUTPUT = 'Javascript Event (key code)';
- var elementid = 'keycode_input';
- var textid = 'keycode';
- var input_box = document.getElementById(elementid);
- var character = (document.all) ? event.keyCode: event.which;
- input_box.value = String.fromCharCode(character);
- keycodes = get_keyboard_codes();
- for (key in keycodes) {
- if (character == key) {
- input_box.value = keycodes[key];
- break;
- }
- }
- document.getElementById(textid).innerHTML = L_CODEOUTPUT+': '+character;
- return;
- }
Code: HTML
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>IE Focus Hack</title>
- <title>Javascript Event Key Codes</title>
- <script type="text/javascript" src="/keycodes.js" charset="utf-8"></script>
- </head>
- <body>
- <p>
- <input type="text" id="keycode_input" onkeypress="return false;" onkeydown="return detect_keycode(event);" />
- <span id="keycode"></span>
- </p>
- </body>
- </html>

