Javascript jQuery多按键处理
我已经对我使用的所有代码进行了修改 您可以看到我想用键盘箭头键移动的div。如你们所见,我可以使用键盘上下左右移动物体。我的问题是我希望对象沿对角线移动,这意味着使用上下组合键 我已经浏览了这么多,但我没有找到任何例子来解释箭头键处理的确切情况。谁能澄清一下吗 提前谢谢 下面是我的JS代码:Javascript jQuery多按键处理,javascript,jquery,keyboard-events,Javascript,Jquery,Keyboard Events,我已经对我使用的所有代码进行了修改 您可以看到我想用键盘箭头键移动的div。如你们所见,我可以使用键盘上下左右移动物体。我的问题是我希望对象沿对角线移动,这意味着使用上下组合键 我已经浏览了这么多,但我没有找到任何例子来解释箭头键处理的确切情况。谁能澄清一下吗 提前谢谢 下面是我的JS代码: $(document).ready(function(){ var obj = $("#movetest") $(window).on({ keydown: function(e){
$(document).ready(function(){
var obj = $("#movetest")
$(window).on({
keydown: function(e){
if ( e.keyCode == 37 ){ move( obj, "left" ); }
if ( e.keyCode == 38 ){ move( obj, "up" ); }
if ( e.keyCode == 39 ){ move( obj, "right" ); }
if ( e.keyCode == 40 ){ move( obj, "down" ); }
}
})
});
function move(obj, dir){
var curHPos = parseInt(obj.css("margin-left"),10),
curVPos = parseInt(obj.css("margin-top"),10),
newHPos = curHPos,
newVPos = curVPos,
diff = 10;
if ( dir == "left" ) { newHPos = curHPos - diff; } else
if ( dir == "right" ) { newHPos = curHPos + diff; } else
if ( dir == "up" ) { newVPos = curVPos - diff; } else
if ( dir == "down" ) { newVPos = curVPos + diff; }
obj.css({
marginLeft: newHPos,
marginTop: newVPos
});
}
你需要看看这个: 在resume中,您需要使用keydown和keyup事件 我在这里结束了它: 我基本上是这样做的:
var keys = {};
var obj = $("#movetest");
$(document).ready(function(){
$(document).on({
keydown: function(e){
keys[e.which] = true;
throwKeys();
},
keyup: function(e){
delete keys[e.which];
throwKeys();
}
});
});
function throwKeys(){
for (var i in keys) {
if (!keys.hasOwnProperty(i)) continue;
if ( i == 37 ){ move( obj, "left" ); }
if ( i == 38 ){ move( obj, "up" ); }
if ( i == 39 ){ move( obj, "right" ); }
if ( i == 40 ){ move( obj, "down" ); }
}
}
我不太明白这个想法,但它很有魅力!谢谢@hyunkeln