在
Javascript中,如何判断用户是否同时按下两个键?
例如,我在屏幕中间画了一个圆圈.当用户按住向上箭头时,我想将其向上移动,而当用户按住向右箭头时,我想向右移动它.那部分很容易.如果用户同时持有向上和向右箭头,我想对角线,向上和向右移动圆圈.
解决方法
这是你在概念上需要做的事情(我猜这叫做伪代码):
从这样的事情开始:
var PIXEL_DELTA = 10; // Distance to move in pixels var leftPressed = 0,upPressed = 0,downPressed = 0,rightPressed = 0;
然后在每个keydown事件中,测试按下的键是否保持向上,向上等,并将其变量从0变为PIXEL_DELTA.
在每个keyup事件中,运行相同的测试并将正确的变量转回0.
然后,在您的移动代码(真实代码)中:(此代码改编自Crescent Fresh的绝佳示例):
function move() { var dot = document.getElementById('dot'),deltaX = rightPressed - leftPressed,deltaY = downPressed - upPressed; if(deltaX) { dot.style.left = (parseInt(dot.style.left,10) || 0) + deltaX + 'px'; } if (deltaY) { dot.style.top = (parseInt(dot.style.top,10) || 0) + deltaY + 'px'; } }
浏览器将(应该)为每个键触发一个单独的keydown / keyup事件,即使它们被“同时”按下.
工作实例
Crescent Fresh汇总了full example on JSBin.一定要访问editable version以及玩代码.