Моя программа Javascript не будет выполнять ничего, кроме console.log (), когда дело доходит до выбора клавиш со стрелками - PullRequest
0 голосов
/ 08 декабря 2018

Итак, это мой код:

   document.onkeydown = checkKey;

function checkKey(e) {

  e = e || window.event;

if (e.keyCode == '38') {
}
    else if (e.keyCode == '40') {
        console.log("Down Arrow");
        g.rect( 200,200,20,20); << Here is the problem. This is ignored.
    }
    else if (e.keyCode == '37') {
        // left arrow
    }
    else if (e.keyCode == '39') {
        // right arrow
    }
}
rect( snake.X,snake.Y,20,20 );

Я хочу, чтобы код изменил положение блока на холсте, но все стрелки «Вниз», когда я нажимаю, пишут в консоли «»Стрелка вниз."Он не будет отображать прямоугольник в X: 200 Y: 200. Кто-нибудь может помочь?Я делаю это для игры со змеями.

1 Ответ

0 голосов
/ 08 декабря 2018

Вы должны указать своей программе нарисовать прямоугольник, который вы указали с помощью команды ctx.stroke();.Пример приведен во фрагменте ниже, вам нужно нажать на iframe, а затем нажать стрелку вниз для его регистрации.

Дайте мне знать, если это не сработает.

document.onkeydown = checkKey;

function checkKey(e) {

  e = e || window.event;
  
  var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");

if (e.keyCode == '38') {
}
    else if (e.keyCode == '40') {
        console.log("Down Arrow");
        ctx.rect( 10,10,20,20); 
        ctx.stroke();
    }
    else if (e.keyCode == '37') {
        // left arrow
    }
    else if (e.keyCode == '39') {
        // right arrow
    }
}
.box {
  height: 100px;
  width: 100px;
  border: 1px solid black;
  }
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;">
</canvas>
...