keydown事件不起作用

时间:2016-12-30 14:20:35

标签: jquery events controller handler

我想在jquery中为我的第一个游戏制作玩家控制器,但有些事情是错误的。你能帮帮我吗?

$('canvas').keydown(function(e) {
    alert('in function');
    if (e.keyCode == 37) {//37 - strzalka w lewo
        moveleft();
    }
    if (e.keyCode == 39) {//39 - strzalka w prawo
        moveright();
    }
    if (e.keyCode == 40) {//40 - strzalka w dol
        movedown();
    }
    if (e.keyCode == 38) {//38 - strzalka w gore
         moveup();
    }
    if (e.keyCode == 32) {//32 - spacja

    }
});

function moveup() {
    gracz.speedY -= 1; 
}

function movedown() {
    gracz.speedY += 1; 
}

function moveleft() {
    gracz.speedX -= 1;
}

function moveright() {
    gracz.speedX += 1;
}

当我按箭头时,事件处理程序不起作用

1 个答案:

答案 0 :(得分:1)

在画布上检索与键相关的事件充其量是不可靠的。使用画布的父元素,甚至是窗口,例如:

$(window).keydown(function(e) {
    // your code here...
});

Working example

另请注意,您可以通过将函数放在对象中的按键事件下运行来简化代码,这些函数由其键码值键入,如下所示:

var gracz = {
    speedY: 0,
    speedX: 0,
    keydown: {
        '37': function() { gracz.speedX -= 1; }, // left
        '38': function() { gracz.speedY -= 1; }, // up
        '39': function() { gracz.speedX += 1; }, // right
        '40': function() { gracz.speedY += 1; }, // down
        '32': function() { console.log('SPACE'); } // space
    }
};

$(window).keydown(function(e) {
    gracz.keydown[e.which](); 
    console.log(gracz);
});

Working example