javascript - JS-jQuery/如何检测按键是否被按下/POLL功能

我正在用Javascript制作乒乓球游戏，屏幕上有一个弹跳的球，您不能让它碰到包装盒的下边框。 （弹跳球不是问题，我已经对此进行了编程）

这是一个代码，当您按下箭头键时，应该使球拍从左向右移动...但是，球拍的作用是在原始位置向左或向右移动很多像素。我的意思是，它不能流畅地移动，只是在左侧或右侧出现30或100像素的样子。

function gameLoop() {

    //**********DETECTS IF LEFT OR RIGHT KEYS ARE PRESSED************

    $(document).keydown(function(e) {
       if(e.keyCode == 37) { //LEFT
            userBoxPosX -= userBoxSpeedX;
       }
       if(e.keyCode == 39) { //RIGHT
            userBoxPosX += userBoxSpeedX;
       }
    });

    //THE USERBOX IS A DIV THAT WE WILL USE AS RAQUET
    userBox.css('left', userBoxPosX + "px");

    setTimeout(gameLoop, 50); //THIS FUNCTION CALLS ITSELF EVERY 50 milliseconds (20FPS)

}

关于如何使它流畅移动的任何想法？当您按下箭头键时？

让我知道您是否需要更多信息或需要我上传项目，以便可以看到它正在工作。

最佳答案

一个简单的解决方案如下所示：

    $(document).keydown(function(e) {
         if(e.keyCode == 37) { //LEFT
            userBoxPosX -= userBoxSpeedX;
            updatePosition();
          }
         if(e.keyCode == 39) { //RIGHT
             userBoxPosX += userBoxSpeedX;
             updatePosition();
          }
      });

function updatePosition() {
    userBox.css('left', userBoxPosX + "px");
};