我个人更喜欢多键方法。这允许检测多个键,但也可以检测单个键,并且它适用于我测试过的每个浏览器。
map={}//declare object to hold data
onkeydown=onkeyup=function(e){
e=e||event//if e doesn't exist (like in IE), replace it with window.event
map[e.keyCode]=e.type=='keydown'?true:false
//Check for keycodes
}
另一种方法是将onkeydown
和onkeyup
事件分开,并在每个事件中明确定义地图子项:
map={}
onkeydown=function(e){
e=e||event
map[e.keyCode]=true
}
onkeyup=function(e){
e=e||event
map[e.keyCode]=false
}
无论哪种方式都可以正常工作。现在,要实际检测击键,包括错误修复在内的方法是:
//[in onkeydown or onkeyup function, after map[e.keyCode] has been decided...]
if(map[keycode]){
//do something
map={}
return false
}
map[keycode]
构成特定的键码,例如13
forEnter
或17
for CTRL
。
该map={}
行清除地图对象以防止它在未聚焦的情况下“按住”键,同时return false
防止,例如,当您检查CTRL+D
. 在某些情况下,您可能希望将其替换为e.preventDefault()
,但我发现return false
在大多数情况下效率更高。只是为了获得清晰的视角,请尝试使用CTRL+D
. Ctrl
是17
,并且D
是68
。请注意,如果没有该return false
行,将弹出书签对话框。
一些例子如下:
if(map[17]&&map[13]){//CTRL+ENTER
alert('CTRL+ENTER was pressed')
map={}
return false
}else if(map[13]){//ENTER
alert('Enter was pressed')
map={}
return false
}
要记住的一件事是,较小的组合应该放在最后。总是先把大的组合在的if..else链,这样你就不会得到两个警报Enter
,并CTRL+ENTER
在同一时间。
现在,一个完整的例子来“把它们放在一起”。假设您要提醒一条消息,其中包含有关在用户按下时SHIFT+?
登录和在用户按下时登录的说明ENTER
。这个例子也是跨浏览器兼容的,这意味着它也适用于 IE:
map={}
keydown=function(e){
e=e||event
map[e.keyCode]=true
if(map[16]&&map[191]){//SHIFT+?
alert('1) Type your username and password\n\n2) Hit Enter to log in')
map={}
return false
}else if(map[13]){//Enter
alert('Logging in...')
map={}
return false
}
}
keyup=function(e){
e=e||event
map[e.keyCode]=false
}
onkeydown=keydown
onkeyup=keyup//For Regular browsers
try{//for IE
document.attachEvent('onkeydown',keydown)
document.attachEvent('onkeyup',keyup)
}catch(e){
//do nothing
}
请注意,某些特殊键对于不同的引擎具有不同的代码。但正如我所测试的,这适用于我目前计算机上的所有浏览器,包括 Maxthon 3、Google Chrome、Internet Explorer(9 和 8)和 Firefox。
我希望这可以帮到你。