我试图开发一个JavaScript游戏引擎,我遇到了这个问题:
当我按空格键时,角色会跳跃。 当我按下→角色向右移动。
问题是,当我按右键,然后按空格键时,角色会跳跃,然后停止移动。
我使用keydown函数来按下键。如何检查是否同时按下了多个键?
我试图开发一个JavaScript游戏引擎,我遇到了这个问题:
当我按空格键时,角色会跳跃。 当我按下→角色向右移动。
问题是,当我按右键,然后按空格键时,角色会跳跃,然后停止移动。
我使用keydown函数来按下键。如何检查是否同时按下了多个键?
当前回答
您应该使用keydown事件来跟踪按下的键,并且应该使用keyup事件来跟踪何时释放键。
请看这个例子:http://jsfiddle.net/vor0nwe/mkHsU/
(更新:我在这里复制代码,以防jsfiddle.net崩溃:) HTML:
<ul id="log">
<li>List of keys:</li>
</ul>
...和Javascript(使用jQuery):
var log = $('#log')[0],
pressedKeys = [];
$(document.body).keydown(function (evt) {
var li = pressedKeys[evt.keyCode];
if (!li) {
li = log.appendChild(document.createElement('li'));
pressedKeys[evt.keyCode] = li;
}
$(li).text('Down: ' + evt.keyCode);
$(li).removeClass('key-up');
});
$(document.body).keyup(function (evt) {
var li = pressedKeys[evt.keyCode];
if (!li) {
li = log.appendChild(document.createElement('li'));
}
$(li).text('Up: ' + evt.keyCode);
$(li).addClass('key-up');
});
在这个例子中,我使用一个数组来跟踪哪些键被按下。在实际应用程序中,您可能希望在释放每个元素的关联键之后删除它们。
注意,虽然我在这个例子中使用了jQuery使事情变得简单,但在“原始”Javascript中工作时,这个概念也同样有效。
其他回答
如果你想找到任何按键事件与控制键,你可以这样做
onkeypress = (e) =>{
console.log(e);
if(e.ctrlKey && e.code == "KeyZ"){
document.write("do somthing")
} }
case 65: //A
jp = 1;
setTimeout("jp = 0;", 100);
if(pj > 0) {
ABFunction();
pj = 0;
}
break;
case 66: //B
pj = 1;
setTimeout("pj = 0;", 100);
if(jp > 0) {
ABFunction();
jp = 0;
}
break;
这不是最好的方法,我知道。
只是让某些东西更稳定:
var keys = [];
$(document).keydown(function (e) {
if(e.which == 32 || e.which == 70){
keys.push(e.which);
if(keys.length == 2 && keys.indexOf(32) != -1 && keys.indexOf(70) != -1){
alert("it WORKS !!"); //MAKE SOMETHING HERE---------------->
keys.length = 0;
}else if((keys.indexOf(32) == -1 && keys.indexOf(70) != -1) || (keys.indexOf(32) != -1 && keys.indexOf(70) == -1) && (keys.indexOf(32) > 1 || keys.indexOf(70) > 1)){
}else{
keys.length = 0;
}
}else{
keys.length = 0;
}
});
您应该使用keydown事件来跟踪按下的键,并且应该使用keyup事件来跟踪何时释放键。
请看这个例子:http://jsfiddle.net/vor0nwe/mkHsU/
(更新:我在这里复制代码,以防jsfiddle.net崩溃:) HTML:
<ul id="log">
<li>List of keys:</li>
</ul>
...和Javascript(使用jQuery):
var log = $('#log')[0],
pressedKeys = [];
$(document.body).keydown(function (evt) {
var li = pressedKeys[evt.keyCode];
if (!li) {
li = log.appendChild(document.createElement('li'));
pressedKeys[evt.keyCode] = li;
}
$(li).text('Down: ' + evt.keyCode);
$(li).removeClass('key-up');
});
$(document.body).keyup(function (evt) {
var li = pressedKeys[evt.keyCode];
if (!li) {
li = log.appendChild(document.createElement('li'));
}
$(li).text('Up: ' + evt.keyCode);
$(li).addClass('key-up');
});
在这个例子中,我使用一个数组来跟踪哪些键被按下。在实际应用程序中,您可能希望在释放每个元素的关联键之后删除它们。
注意,虽然我在这个例子中使用了jQuery使事情变得简单,但在“原始”Javascript中工作时,这个概念也同样有效。
Easiest, and most Effective Method
//check key press
function loop(){
//>>key<< can be any string representing a letter eg: "a", "b", "ctrl",
if(map[*key*]==true){
//do something
}
//multiple keys
if(map["x"]==true&&map["ctrl"]==true){
console.log("x, and ctrl are being held down together")
}
}
//>>>variable which will hold all key information<<
var map={}
//Key Event Listeners
window.addEventListener("keydown", btnd, true);
window.addEventListener("keyup", btnu, true);
//Handle button down
function btnd(e) {
map[e.key] = true;
}
//Handle Button up
function btnu(e) {
map[e.key] = false;
}
//>>>If you want to see the state of every Key on the Keybaord<<<
setInterval(() => {
for (var x in map) {
log += "|" + x + "=" + map[x];
}
console.log(log);
log = "";
}, 300);