javascript代码实现键盘控制方向

通过javascript代码实现对键盘上下左右方向键的控制,最好也有回车键的控制。不只是个很简单的例子,最好可以复杂点。
最好可以实现这样一个效果:有四张小图片,可以让鼠标在四个小图片上下跑,如果还能实现左右两个方向更好。

第1个回答  2014-01-14
01 <script type="text/javascript">
02 //这个就是键盘触发的函数
03 var SubmitOrHidden = function(evt){
04 evt = window.event || evt;
05 if(evt.keyCode!=13){//如果取到的键值是回车
06 //do something
07 }else{
08 //其他键 dosomething
09 }
10
11 }
12 window.document.onkeydown=SubmitOrHidden;//当有键按下时执行函数
13 </script>
14 附常用功能键
15 常数 值 描述
16 vbKeyBack 8 BACKSPACE 键
17 vbKeyTab 9 TAB 键
18 vbKeyReturn 13 ENTER 键
19 vbKeyShift 16 SHIFT 键
20 vbKeyControl 17 CTRL 键
21 vbKeyCapital 20 CAPS LOCK 键
22 vbKeyEscape 27 ESC 键
23 vbKeySpace 32 SPACEBAR 键
24 vbKeyPageUp 33 PAGEUP 键
25 vbKeyPageDown 34 PAGEDOWN 键
26 vbKeyEnd 35 END 键
27 vbKeyPrint 42 PRINT SCREEN 键
28 vbKeyDelete 46 DEL 键
29 vbKeyNumlock 144 NUM LOCK 键追问

你说的这个我知道,第一是要出现键盘控制的效果,要结合方向键来控制图片。感谢你啊!

第2个回答  2014-01-03
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>在div内部拖动div</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
</head>
<body>
<div id="main"></div>
</body>
</html>
<script type="text/javascript">
var main = document.getElementById("main");
document.onkeydown = function(event){
event = event || window.event;
var keycode = event.keyCode || event.which;

switch(keycode){
case 13:
main.innerHTML = "enter";
break;
case 37:
main.innerHTML = "zuo";
break;
case 38:
main.innerHTML = "shang";
break;
case 39:
main.innerHTML = "you";
break;
case 40:
main.innerHTML = "xia";
break;
}
};
</script>

追问

非常感谢!这个效果还没完全实现。
朋友,能不能实现一个效果:有四个小图片,可以用键盘的上下键来让焦点在这四个小图片上下动。如果可以,我自己试试左右两个方向。
如果可能,万分感谢!!!

追答

这个有点难,我得考虑一下

第3个回答  2014-01-15
// jquery快捷键事件
$(document).keydown(function(e) {
if (e.ctrlKey && e.which == 65) {
……………………
} else if (e.ctrlKey && e.which == 83) {
…………………………
} else if (e.which == 27) {
……………………
}
});
第4个回答  2014-01-14
js是没有办法控制鼠标位置的,只能控制图片位置。可以通过对document的keyup事件进行监听,根据事件的eventKey来做相应判断。
第5个回答  2014-01-14
onkeydown onkeyup事件 keycode左:37上:38 右:39 下:40,然后就是计算了,这个。。。你慢慢算吧
相似回答