js判断键盘按键

叁歲伎倆 2022-06-03 03:16 465阅读 0赞

**js判断键盘按键**

判断方法:

<table> 
 <thead> 
 <tr> 
 <td colspan="2"> 表 3. DHTML 键盘事件 </td> 
 </tr> 
 <tr> 
 <td> 名称 </td> 
 <td> 说明 </td> 
 </tr> 
 </thead> 
 <tbody> 
 <tr> 
 <td> onkeypress </td> 
 <td> 这个事件在用户按下并放开任何字母数字键时发生。系统按钮（例如，箭头键和功能键）无法得到识别。 </td> 
 </tr> 
 <tr> 
 <td> onkeyup </td> 
 <td> 这个事件在用户放开任何先前按下的键盘键时发生。 </td> 
 </tr> 
 <tr> 
 <td> onkeydown </td> 
 <td> 这个事件在用户按下任何键盘键（包括系统按钮，如箭头键和功能键）时发生。 </td> 
 </tr> 
 </tbody> 
</table>

示例：

function document.onkeydown()  
\{  
if ( event.keyCode=='39' ) //->右箭头  
\{  
window.open("[http://www.163.com][http_www.163.com]");  
\}  
\}

function document.onkeypress()  
\{  
if ( event.keyCode=='43' )  
\{  
alert( '你输入了键盘的 “ + ” 键');  
\}  
\}

在使用JavaScript做WEB键盘事件侦听捕获时，主要采用onkeypress、onkeydown、onkeyup三个事件进行出来。该三个事件的执行顺序如下：onkeydown -> onkeypress ->onkeyup。在一般情况下，采用三种键盘事件均可对键盘输入进行有效的响应。当在实际使用中，会发现这几者有些不同的差别。  
  
onkeypress事件不能对系统功能键(例如：后退、删除等，其中对中文输入法不能有效响应)进行正常的响应，onkeydown和onkeyup均可以对系统功能键进行有效的拦截，但事件截获的位置不同，可以根据具体的情况选择不同的键盘事件。  
由于onkeypress不能对系统功能键进行捕获，导致window.event对象的keyCode属性和onkeydown，onkeyup键盘事件中获取的keyCode属性不同，主要表现在onkeypress事件的keyCode对字母的大小写敏感，而onkeydown、onkeyup事件不敏感；onkeypress事件的keyCode无法区分主键盘上的数字键和付键盘数字键的，而onkeydown、onkeyup的keyCode对主付键盘的数字键敏感。  
[http://liu2liu2.spaces.live.com/blog/cns!54B12917375EF5A0!270.entry][http_liu2liu2.spaces.live.com_blog_cns_54B12917375EF5A0_270.entry]

屏蔽组合键ctrl+N

<scriptlanguage=**javascript**> 
function KeyDown()\{ 
if ((window.event.altKey)&& 
((window.event.keyCode==37)|| //屏蔽 Alt+ 方向键 ← 
(window.event.keyCode==39)))\{ //屏蔽 Alt+ 方向键 → 
alert("不准你使用ALT+方向键前进或后退网页！"); 
event.returnValue=false; 
\} 
if ((event.keyCode==8)|| //屏蔽退格删除键 
(event.keyCode==116))\{ //屏蔽 F5 刷新键 
event.keyCode=0; 
event.returnValue=false; 
\} 
if ((event.ctrlKey)&&(event.keyCode==78))\{ //屏蔽 Ctrl+n 
event.returnValue=false; 
\} 
if ((event.shiftKey)&&(event.keyCode==121))\{ //屏蔽 shift+F10 
event.returnValue=false; 
\} 
if (event.keyCode==122)\{ //屏蔽 F11 
event.returnValue=false; 
\} 
\}

<table> 
 <tbody> 
 <tr> 
 <td> 
 <table style="background:#CCCCCC"> 
 <tbody> 
 <tr> 
 <td style="background:#DDDDDD"> ASCII码 </td> 
 <td style="background:#DDDDDD"> 键盘 </td> 
 <td style="background:#DDDDDD"> ASCII 码 </td> 
 <td style="background:#DDDDDD"> 键盘 </td> 
 <td style="background:#DDDDDD"> ASCII 码 </td> 
 <td style="background:white"> 键盘 </td> 
 <td style="background:#DDDDDD"> ASCII 码 </td> 
 <td style="background:#DDDDDD"> 键盘 </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 27 </td> 
 <td style="background:white"> ESC </td> 
 <td style="background:white"> 32 </td> 
 <td style="background:white"> SPACE </td> 
 <td style="background:white"> 33 </td> 
 <td style="background:white"> ! </td> 
 <td style="background:white"> 34 </td> 
 <td style="background:white"> " </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 35 </td> 
 <td style="background:white"> # </td> 
 <td style="background:white"> 36 </td> 
 <td style="background:white"> $ </td> 
 <td style="background:white"> 37 </td> 
 <td style="background:white"> % </td> 
 <td style="background:white"> 38 </td> 
 <td style="background:white"> &amp; </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 39 </td> 
 <td style="background:white"> ' </td> 
 <td style="background:white"> 40 </td> 
 <td style="background:white"> ( </td> 
 <td style="background:white"> 41 </td> 
 <td style="background:white"> ) </td> 
 <td style="background:white"> 42 </td> 
 <td style="background:white"> * </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 43 </td> 
 <td style="background:white"> + </td> 
 <td style="background:white"> 44 </td> 
 <td style="background:white"> ' </td> 
 <td style="background:white"> 45 </td> 
 <td style="background:white"> - </td> 
 <td style="background:white"> 46 </td> 
 <td style="background:white"> . </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 47 </td> 
 <td style="background:white"> / </td> 
 <td style="background:white"> 48 </td> 
 <td style="background:white"> 0 </td> 
 <td style="background:white"> 49 </td> 
 <td style="background:white"> 1 </td> 
 <td style="background:white"> 50 </td> 
 <td style="background:white"> 2 </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 51 </td> 
 <td style="background:white"> 3 </td> 
 <td style="background:white"> 52 </td> 
 <td style="background:white"> 4 </td> 
 <td style="background:white"> 53 </td> 
 <td style="background:white"> 5 </td> 
 <td style="background:white"> 54 </td> 
 <td style="background:white"> 6 </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 55 </td> 
 <td style="background:white"> 7 </td> 
 <td style="background:white"> 56 </td> 
 <td style="background:white"> 8 </td> 
 <td style="background:white"> 57 </td> 
 <td style="background:white"> 9 </td> 
 <td style="background:white"> 58 </td> 
 <td style="background:white"> : </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 59 </td> 
 <td style="background:white"> ; </td> 
 <td style="background:white"> 60 </td> 
 <td style="background:white"> &lt;&nbsp; </td> 
 <td style="background:white"> 61 </td> 
 <td style="background:white"> = </td> 
 <td style="background:white"> 62 </td> 
 <td style="background:white"> &gt;&nbsp; </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 63 </td> 
 <td style="background:white"> ? </td> 
 <td style="background:white"> 64 </td> 
 <td style="background:white"> @ </td> 
 <td style="background:white"> 65 </td> 
 <td style="background:white"> A </td> 
 <td style="background:white"> 66 </td> 
 <td style="background:white"> B </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 67 </td> 
 <td style="background:white"> C </td> 
 <td style="background:white"> 68 </td> 
 <td style="background:white"> D </td> 
 <td style="background:white"> 69 </td> 
 <td style="background:white"> E </td> 
 <td style="background:white"> 70 </td> 
 <td style="background:white"> F </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 71 </td> 
 <td style="background:white"> G </td> 
 <td style="background:white"> 72 </td> 
 <td style="background:white"> H </td> 
 <td style="background:white"> 73 </td> 
 <td style="background:white"> I </td> 
 <td style="background:white"> 74 </td> 
 <td style="background:white"> J </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 75 </td> 
 <td style="background:white"> K </td> 
 <td style="background:white"> 76 </td> 
 <td style="background:white"> L </td> 
 <td style="background:white"> 77 </td> 
 <td style="background:white"> M </td> 
 <td style="background:white"> 78 </td> 
 <td style="background:white"> N </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 79 </td> 
 <td style="background:white"> O </td> 
 <td style="background:white"> 80 </td> 
 <td style="background:white"> P </td> 
 <td style="background:white"> 81 </td> 
 <td style="background:white"> Q </td> 
 <td style="background:white"> 82 </td> 
 <td style="background:white"> R </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 83 </td> 
 <td style="background:white"> S </td> 
 <td style="background:white"> 84 </td> 
 <td style="background:white"> T </td> 
 <td style="background:white"> 85 </td> 
 <td style="background:white"> U </td> 
 <td style="background:white"> 86 </td> 
 <td style="background:white"> V </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 87 </td> 
 <td style="background:white"> W </td> 
 <td style="background:white"> 88 </td> 
 <td style="background:white"> X </td> 
 <td style="background:white"> 89 </td> 
 <td style="background:white"> Y </td> 
 <td style="background:white"> 90 </td> 
 <td style="background:white"> Z </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 91 </td> 
 <td style="background:white"> [ </td> 
 <td style="background:white"> 92 </td> 
 <td style="background:white"> \ </td> 
 <td style="background:white"> 93 </td> 
 <td style="background:white"> ] </td> 
 <td style="background:white"> 94 </td> 
 <td style="background:white"> ^ </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 95 </td> 
 <td style="background:white"> _ </td> 
 <td style="background:white"> 96 </td> 
 <td style="background:white"> ` </td> 
 <td style="background:white"> 97 </td> 
 <td style="background:white"> a </td> 
 <td style="background:white"> 98 </td> 
 <td style="background:white"> b </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 99 </td> 
 <td style="background:white"> c </td> 
 <td style="background:white"> 100 </td> 
 <td style="background:white"> d </td> 
 <td style="background:white"> 101 </td> 
 <td style="background:white"> e </td> 
 <td style="background:white"> 102 </td> 
 <td style="background:white"> f </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 103 </td> 
 <td style="background:white"> g </td> 
 <td style="background:white"> 104 </td> 
 <td style="background:white"> h </td> 
 <td style="background:white"> 105 </td> 
 <td style="background:white"> i </td> 
 <td style="background:white"> 106 </td> 
 <td style="background:white"> j </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 107 </td> 
 <td style="background:white"> k </td> 
 <td style="background:white"> 108 </td> 
 <td style="background:white"> l </td> 
 <td style="background:white"> 109 </td> 
 <td style="background:white"> m </td> 
 <td style="background:white"> 110 </td> 
 <td style="background:white"> n </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 111 </td> 
 <td style="background:white"> o </td> 
 <td style="background:white"> 112 </td> 
 <td style="background:white"> p </td> 
 <td style="background:white"> 113 </td> 
 <td style="background:white"> q </td> 
 <td style="background:white"> 114 </td> 
 <td style="background:white"> r </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 115 </td> 
 <td style="background:white"> s </td> 
 <td style="background:white"> 116 </td> 
 <td style="background:white"> t </td> 
 <td style="background:white"> 117 </td> 
 <td style="background:white"> u </td> 
 <td style="background:white"> 118 </td> 
 <td style="background:white"> v </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 119 </td> 
 <td style="background:white"> w </td> 
 <td style="background:white"> 120 </td> 
 <td style="background:white"> x </td> 
 <td style="background:white"> 121 </td> 
 <td style="background:white"> y </td> 
 <td style="background:white"> 122 </td> 
 <td style="background:white"> z </td> 
 </tr> 
 <tr> 
 <td style="background:white"> 123 </td> 
 <td style="background:white"> { </td> 
 <td style="background:white"> 124 </td> 
 <td style="background:white"> | </td> 
 <td style="background:white"> 125 </td> 
 <td style="background:white"> } </td> 
 <td style="background:white"> 126 </td> 
 <td style="background:white"> ~ </td> 
 </tr> 
 </tbody> 
 </table> </td> 
 </tr> 
 </tbody> 
</table>

**键盘数字对应的ASCII码（keycode码）**

2011-01-29 14:46

<table> 
 <tbody> 
 <tr> 
 <td> keycode 1 = 鼠标左键 keycode 2 = 鼠标右键 keycode 3 = Cancel keycode 4 = 鼠标中键 keycode 8 = BackSpace keycode 9 = 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 keycode 32 = space keycode 33 = Prior（PageUp键） keycode 34 = Next（PageDown键） keycode 35 = End keycode 36 = Home keycode 37 = Left keycode 38 = Up keycode 39 = Right keycode 40 = Down keycode 41 = Select（未知） keycode 42 = Print（PrintScreen键） 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（小键盘数字0） keycode 97 = KP_1 KP_1（小键盘数字1） keycode 98 = KP_2 KP_2（小键盘数字2） keycode 99 = KP_3 KP_3（小键盘数字3） keycode 100 = KP_4 KP_4（小键盘数字4） keycode 101 = KP_5 KP_5（小键盘数字5） keycode 102 = KP_6 KP_6（小键盘数字6） keycode 103 = KP_7 KP_7（小键盘数字7） keycode 104 = KP_8 KP_8（小键盘数字8） keycode 105 = KP_9 KP_9（小键盘数字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 （未知 &amp; ^） 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（未知） 如果要使用组合键，则可以利用event.ctrlKey，event.shiftKey，event .altKey值为true或false，判断是否按下了ctrl键、shift键以及alt键。 例：event.ctrlKey=true &amp;&amp; event.keycode=65 </td> 
 </tr> 
 </tbody> 
</table>

[http_www.163.com]: http://www.163.com/
[http_liu2liu2.spaces.live.com_blog_cns_54B12917375EF5A0_270.entry]: http://liu2liu2.spaces.live.com/blog/cns!54B12917375EF5A0!270.entry