利用Javascript脚本捕获键盘事件
关键字: javascript 捕获键盘事件
在很多应用中,用户都希望WEB应用能够在界面上支持一些快捷键,最常见的就是上下左右、TAB、回车等的快捷键支持。抛开在页面上运行Applet、Flash 的方式来对键盘快捷键支持外,利用JavaScript也能够有出色的表现。
在对键盘时间的支持上,操作系统提供了一整套的虚拟键键值,要使我们的应用能够很好的支持快捷键,了解这些键值是必不可少的。
现将常见的键值列举如下:
A 0X65 U 0X85
B 0X66 V 0X86
C 0X67 W 0X87
D 0X68 X 0X88
E 0X69 Y 0X89
F 0X70 Z 0X90
G 0X71 0 0X48
H 0X72 1 0X49
I 0X73 2 0X50
J 0X74 3 0X51
K 0X75 4 0X52
L 0X76 5 0X53
M 0X77 6 0X54
N 0X78 7 0X55
O 0X79 8 0X56
P 0X80 9 0X57
Q 0X81 ESC 0X1B
R 0X82 CTRL 0X11
S 0X83 SHIFT 0X10
T 0X84 ENTER 0XD(用十进制就是13)
B 0X66 V 0X86
C 0X67 W 0X87
D 0X68 X 0X88
E 0X69 Y 0X89
F 0X70 Z 0X90
G 0X71 0 0X48
H 0X72 1 0X49
I 0X73 2 0X50
J 0X74 3 0X51
K 0X75 4 0X52
L 0X76 5 0X53
M 0X77 6 0X54
N 0X78 7 0X55
O 0X79 8 0X56
P 0X80 9 0X57
Q 0X81 ESC 0X1B
R 0X82 CTRL 0X11
S 0X83 SHIFT 0X10
T 0X84 ENTER 0XD(用十进制就是13)
还有方向键:
← 37 → 39
F1键 112 F2键 113
F3键 114 F4键 115
F5键 115 F6键 116
F7键 117 F8键 118
F1键 119 F4键 110
退格删除键 8 TAB键 40
通常,快捷键的支持都是在整个Document对象内部都有效的。因此,在声明脚本时可以采用以下方式:
<script language="javascript" for="document" event="onkeydown">
这样,在整个Document对象内部,你所声明的其内所有的脚本都会生效。因此,如果你需要做的处理都比较简单的话,你也不必要使用function来处理。这种方式或许会更加有效。
为了能够更好的支持虚拟键,JavaScript还对一些常用控制键进行了更进一步的封装,这些键有:Ctrl键、Shift键、Alt键等,对应的操作指令分别为:
window.event.ctrlKey
window.event.shiftKey
window.event.altKey
举个简单的例子:如果我们要在页面上将Enter键和Tab键都屏蔽成将光标向下一个表单元素移动,那么可以加入以下代码:
js 代码
但是,你很快就会发现,上面的代码只有在 IE 上有效,而在 Netscape 上却怎么也得不到你想要的结果,原因是 Netscape 和 IE 在对键盘事件的JS支持上是不同的。对于类似于:event.keyCode 这样的东西只有IE才能够支持,而在 Netscape 上,则采用e.which ,因此,如果你的应用需要支持多浏览器版,需要做的在这里也许仅仅是用e.which 来代替 window.event.keyCode 。
用两种浏览器检查上述实例,你会发现执行结果不总是一样的,这是因为两种浏览器的键盘代码设置不相同,因此你必须使用单独的代码分别来写这段程序(行业垄断和竞争的悲剧呀!--痛苦的可是我们这帮程序员呀......)。
以下是一个在网路上找到的对 IE 和 Netscape 进行分别处理的小程序,通过这段代码可以很容易看出两个浏览器的不同处理方式:
js 代码