用js实现键盘记录,要知道的三种按键事件类型,即keydown,keypress和keyup,它们分别对应onkeydown、 onkeypress和onkeyup这三个事件。一个典型的按键会产生所有这三种事件,依次是keydown ?→ keypress,然后是按键释放时 候的keyup。
keydown和 keypress 有什么区别呢?
答:http://www.chenzejiang.com/?p=228
键码值集合大全
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 |
keycode 8 = BackSpace BackSpace keycode 9 = Tab Tab keycode 12 = Clear keycode 13 = Enter keycode 16 = Shift_L keycode 17 = Control_L keycode 18 = Alt_L keycode 19 = Pause keycode 20 = Caps_Lock keycode 27 = Escape Escape keycode 32 = space space keycode 33 = Prior keycode 34 = Next keycode 35 = End keycode 36 = Home keycode 37 = Left keycode 38 = Up keycode 39 = Right keycode 40 = Down keycode 41 = Select keycode 42 = Print keycode 43 = Execute keycode 45 = Insert keycode 46 = Delete keycode 47 = Help keycode 48 = 0 equal braceright keycode 49 = 1 exclam onesuperior keycode 50 = 2 quotedbl twosuperior keycode 51 = 3 section threesuperior keycode 52 = 4 dollar keycode 53 = 5 percent keycode 54 = 6 ampersand keycode 55 = 7 slash braceleft keycode 56 = 8 parenleft bracketleft keycode 57 = 9 parenright bracketright keycode 65 = a A keycode 66 = b B keycode 67 = c C keycode 68 = d D keycode 69 = e E EuroSign keycode 70 = f F keycode 71 = g G keycode 72 = h H keycode 73 = i I keycode 74 = j J keycode 75 = k K keycode 76 = l L keycode 77 = m M mu keycode 78 = n N keycode 79 = o O keycode 80 = p P keycode 81 = q Q at keycode 82 = r R keycode 83 = s S keycode 84 = t T keycode 85 = u U keycode 86 = v V keycode 87 = w W keycode 88 = x X keycode 89 = y Y keycode 90 = z Z keycode 96 = KP_0 KP_0 keycode 97 = KP_1 KP_1 keycode 98 = KP_2 KP_2 keycode 99 = KP_3 KP_3 keycode 100 = KP_4 KP_4 keycode 101 = KP_5 KP_5 keycode 102 = KP_6 KP_6 keycode 103 = KP_7 KP_7 keycode 104 = KP_8 KP_8 keycode 105 = KP_9 KP_9 keycode 106 = KP_Multiply KP_Multiply keycode 107 = KP_Add KP_Add keycode 108 = KP_Separator KP_Separator keycode 109 = KP_Subtract KP_Subtract keycode 110 = KP_Decimal KP_Decimal keycode 111 = KP_Divide KP_Divide keycode 112 = F1 keycode 113 = F2 keycode 114 = F3 keycode 115 = F4 keycode 116 = F5 keycode 117 = F6 keycode 118 = F7 keycode 119 = F8 keycode 120 = F9 keycode 121 = F10 keycode 122 = F11 keycode 123 = F12 keycode 124 = F13 keycode 125 = F14 keycode 126 = F15 keycode 127 = F16 keycode 128 = F17 keycode 129 = F18 keycode 130 = F19 keycode 131 = F20 keycode 132 = F21 keycode 133 = F22 keycode 134 = F23 keycode 135 = F24 keycode 136 = Num_Lock keycode 137 = Scroll_Lock keycode 187 = acute grave keycode 188 = comma semicolon keycode 189 = minus underscore keycode 190 = period colon keycode 192 = numbersign apostrophe keycode 210 = plusminus hyphen macron keycode 211 = keycode 212 = copyright registered keycode 213 = guillemotleft guillemotright keycode 214 = masculine ordfeminine keycode 215 = ae AE keycode 216 = cent yen keycode 217 = questiondown exclamdown keycode 218 = onequarter onehalf threequarters keycode 220 = less greater bar keycode 221 = plus asterisk asciitilde keycode 227 = multiply division keycode 228 = acircumflex Acircumflex keycode 229 = ecircumflex Ecircumflex keycode 230 = icircumflex Icircumflex keycode 231 = ocircumflex Ocircumflex keycode 232 = ucircumflex Ucircumflex keycode 233 = ntilde Ntilde keycode 234 = yacute Yacute keycode 235 = oslash Ooblique keycode 236 = aring Aring keycode 237 = ccedilla Ccedilla keycode 238 = thorn THORN keycode 239 = eth ETH keycode 240 = diaeresis cedilla currency keycode 241 = agrave Agrave atilde Atilde keycode 242 = egrave Egrave keycode 243 = igrave Igrave keycode 244 = ograve Ograve otilde Otilde keycode 245 = ugrave Ugrave keycode 246 = adiaeresis Adiaeresis keycode 247 = ediaeresis Ediaeresis keycode 248 = idiaeresis Idiaeresis keycode 249 = odiaeresis Odiaeresis keycode 250 = udiaeresis Udiaeresis keycode 251 = ssharp question backslash keycode 252 = asciicircum degree keycode 253 = 3 sterling keycode 254 = Mode_switch |
上面的键码唯独没有ctrl ,如果按下了 ctrl 要执行事件要怎么办呢? 我们可以使用 ctrlkey 如下
1 2 3 4 5 6 |
document.onkeydown = function(evt){ var e = e || window.event; if(e.ctrlKey){ alert("ctrl键不能使用"); } } |
组合键要怎么办? 使用 && 运算符
1 2 3 4 5 6 |
document.onkeydown = function(evt){ var e = e || window.event; if(e.ctrlKey && e.keyCode == 83){ alert("ctrl+s不能使用"); } } |
使用event对象得到输入的键值,和键码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
document.onkeypress = function(evt) { alert('你按下了' + String.fromCharCode(getCharCode(evt)) + ' 它的ASCII码是' + getCharCode(evt)); } //字符按键兼容 function getCharCode(evt) { var e = evt || window.event; if(typeof e.charCode =='number') { return e.charCode; // 非IE } else { return e.keyCode; // IE } } |
判断键盘上下左右按键事件
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
document.onkeydown=function(event){ var e = event || window.event; if(e && e.keyCode==38){ alert('你按下了上建'); } if(e && e.keyCode==37){ alert('你按下了左键') } if(e && e.keyCode==40){ alert('你按下了下键'); } if(e && e.keyCode==39){ alert('你按下了右键'); } }; |
PS:其他按键也是一样,例如经常可以看到通过按下 Enter键可以登录某个网站,也是可以通过这个去执行
PS:e = e||window.event;这句代码是为了进行浏览器事件对象获取的兼容。js中这句代码的意思是,如果在非IE浏览器,隐藏的变量e是存在的,那么e||event返回e,如果在IE中,隐藏变量e是不存在,则返回event。