как использовать два события onkeydown одновременно?

Question

Я пытаюсь создать игру в понг и хочу, чтобы доски могли двигаться одновременно (одна с «s» и «w», а другая с «вверх» и «вниз»).

            function movePlayer1(event) {
                if (player1.y > 7.5 && player1.y < 390) {
                    switch (event.keyCode) {
                        case 83: player1.y += player1.v;
                            break;
                        case 87: player1.y -= player1.v;
                            break;
                    }
                }
                else if (player1.y <= 7.5) {
                    switch (event.keyCode) {
                        case 83: player1.y += player1.v;
                            break;
                    }
                }
                else if (player1.y >= 390) {
                    switch (event.keyCode) {
                        case 87: player1.y -= player1.v;
                            break;
                    }
                }
            }
            document.addEventListener("keydown", movePlayer1, false);

            function movePlayer2() {
                if (player2.y > 7.5 && player2.y < 390) {
                    switch (event.keyCode) {
                        case 40: player2.y += player2.v;
                            break;
                        case 38: player2.y -= player2.v;
                            break;
                    }
                }
                else if (player2.y <= 7.5) {
                    switch (event.keyCode) {
                        case 40: player2.y += player2.v;
                            break;
                    }
                }
                else if (player2.y >= 390) {
                    switch (event.keyCode) {
                        case 38: player2.y -= player2.v;
                            break;
                    }
                }
            }
            document.addEventListener("keydown", movePlayer2, false);

Я пытался поместить их в одну функцию, но это не помогло.

Answer 1

Есть две вещи, которые заставляют ваш код вести себя не так, как вы ожидаете.

Автоповтор работает только для последней нажатой клавиши. Скажем, если вы нажмете «A» и удержите его, автоповтор генерирует события нажатия клавиш для «A». Но если вы нажмете «B» и удерживаете оба автоповтора, будет автоматически генерироваться последовательное нажатие только для «B». С другой стороны, я считаю, что для MacOS это вообще не будет повторяться автоматически, поэтому лучше не полагаться на это.

Но на самом деле «keyup» срабатывает правильно, даже если были нажаты и удерживаются клавиши Mutliple.

Таким образом, вы можете реорганизовать свой код: вместо того, чтобы полагаться на keyup / keydown, вам нужен только таймер, и у каждой модели игрока будет

{
  directionIsUp: true | false,
  isMoving: true | false
}

Так что keydown вы устанавливаете соответствующее направление и сделать isMoving равным true. И на keyup вы делаете isMoving ложным.

И таймер будет перерисовывать ваше поле битвы в соответствии с этими моделями - либо перемещать игрока, либо держать его в том же месте.