Javascript 自动发射子弹而不是依靠按键？_Javascript_Html_Canvas

Javascript 自动发射子弹而不是依靠按键？

javascript html canvas

Javascript 自动发射子弹而不是依靠按键？,javascript,html,canvas,Javascript,Html,Canvas,我正在尝试使用canavas、html5和javascript开发一个游戏。我的问题是，我想在下面给出的代码中，每隔300毫秒自动发射一次子弹。但是，它们会根据按键来发射。请帮助我的游戏代码如下： <!DOCTYPE html> <html> <script src="jquery.js"></script> <style> #canvas{ border:inset 1px black; } </style> <b

我正在尝试使用canavas、html5和javascript开发一个游戏。我的问题是，我想在下面给出的代码中，每隔300毫秒自动发射一次子弹。但是，它们会根据按键来发射。请帮助

我的游戏代码如下：

<!DOCTYPE html>
<html>
<script src="jquery.js"></script>
<style>
#canvas{
border:inset 1px black;
}
</style>
<body>
<canvas id="canvas" width=400 height=300></canvas>

<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");



var ballX = 0;
var ballY = 270;
var bulletY=270
var bulletX=50;
draw();
bullet();
function bulletFire()
{
if(bulletY<0)
 {
   bulletY=270;
   bullet();
 }
 else       
 bulletY-=10;
}

function draw() {

  ctx.clearRect(0,0,400,300);   
  ctx.fillStyle="black"
  ctx.beginPath();
  ctx.fillRect(ballX, ballY,100,30);
  ctx.closePath(); 
  ctx.fill();   
}
function bullet()
{
//ctx.clearRect(0,0,400,300);
  ctx.beginPath();
  ctx.fillRect(bulletX, bulletY,15,30);
  ctx.closePath();
}

  // Here we just handle command keys
  function keyDownHandler(event) {

  // get which key the user pressed
  var key = event.which;

  // Let keypress handle displayable characters
  if (key > 46) {
    return;
  }

  switch (key) {
    case 37:if(ballX!=0)
        // left key
            { 
        // move the ball 1 left by subtracting 1 from ballX
        ballX -= 4;
        bulletX -=4;
       }


        break;

    case 39:
        // right key
          if(ballX!=300)
        // move the ball 1 right by adding 1 to ballX
        {
        ballX += 4;
        bulletX +=4;
        }  

        break;

    default:
        break;
  }

  // redraw everything
  draw();
  bullet();   
  window.setInterval(bulletFire,300);    
}
//draw();


// Listen for when the user presses a key down
window.addEventListener("keydown", keyDownHandler, true);
</script>

</body>
</html>


#帆布{
边框：插入1px黑色；
}
var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
var-ballX=0；
var-ballY=270；
变量bulletY=270
var=x=50；
draw（）；
子弹（）；
函数bulletFire（）
{
如果（bulletY 46）{
返回；
}
开关（钥匙）{
案例37：如果（ballX！=0）
//左键
{ 
//通过从ballX中减去1，向左移动球1
ballX-=4；
bulletX-=4；
}
打破
案例39：
//右键
如果（ballX！=300）
//通过向ballX添加1，将球向右移动1
{
ballX+=4；
x+=4；
}  
打破
违约：
打破
}
//重画一切
draw（）；
子弹（）；
窗口设置间隔（bulletFire，300）；
}
//draw（）；
//当用户按下某个键时，请倾听
addEventListener（“keydown”，keydowHandler，true）；

Javascript允许您定义

keydown

处理程序以及

keyup

处理程序。您通常使用这些来切换变量，这些变量表示哪些键当前处于“向上”或“向下”状态。他们只设置这些变量，没有其他设置

此外，游戏机制通常在更新函数中实现——这是一个定期执行的函数。在Javascript中，您可以很容易地使用函数调度此类函数的执行

在该功能期间，检查哪些键当前处于“向下”状态，并执行相应的操作。此功能还应更新所有不受播放器控制的对象的位置，检查碰撞情况，并在对象碰撞时执行交互。

您的按键下处理程序中有计时器。