Javascript移動球員與密鑰

-2

我想能夠控制兩個球員，並使他們以一定的速度移動，我沒有得到控制檯中的任何錯誤，並寫出它應該做什麼......但我看到沒有發生任何行動。Javascript移動球員與密鑰

//control system 

    window.addEventListener('keydown', function (event) { 
    //left key 
     if (event.keyCode === 37) { 
      playerOne.x -= 1; 
      console.log("player 1 left"); 
     } 
    //right key 
     else if (event.keyCode === 39) { 
      playerOne.x += 1; 
      console.log("player 1 right"); 
     } 
    //up key 
     else if (event.keyCode === 38) { 
      playerOne.y -= 1; 
      console.log("player 1 up"); 
     } 
    //down 
     else if (event.keyCode === 40) { 
      playerOne.y += 1; 
      console.log("player 1 down"); 
     } 
    // bomb 
     else if (event.keyCode === 13) { 
      console.log("place bomb"); 
     } 
    }); 
    window.addEventListener('keydown', function (event) { 
    //left key 
     if (event.keyCode === 65) { 
      playerTwo.x -= 1; 
      console.log("player 2 left"); 
     } 
    //right key 
     else if (event.keyCode === 68) { 
      playerTwo.x += 1; 
      console.log("player 2 right"); 
     } 
    //up key 
     else if (event.keyCode === 87) { 
      playerTwo.y -= 1; 
      console.log("player 2 up"); 
     } 
    //down 
     else if (event.keyCode === 83) { 
      playerTwo.y += 1; 
      console.log("player 2 down"); 
    } 
    // bomb 
    else if (event.keyCode === 32) { 
     console.log("place bomb"); 
    } 
}); 

function movePlayers() { 
    "use strict"; 
    if (keys.moveLeft) { 
     playerOne.x -= powerUps.speed; 
     if (playerOne.currentDirection != "left") { 
      playerOne.gotoAndPlay('left') 
      playerOne.currentDirection = "left"; 
     } 
    } 
    if (keys.moveRight) { 
     playerOne.x += powerUps.speed; 
     if (playerOne.currentDirection != "right") { 
      playerOne.gotoAndPlay('right') 
      playerOne.currentDirection = "right"; 
     } 
    } 
    if (keys.moveUp) { 
     playerOne.y -= powerUps.speed; 
     if (playerOne.currentDirection != "up") { 
      playerOne.gotoAndPlay('up') 
      playerOne.currentDirection = "up"; 
     } 
    } 
    if (keys.moveDown) { 
     playerOne.y += powerUps.speed; 
     if (playerOne.currentDirection != "down") { 
      playerOne.gotoAndPlay('down') 
      playerOne.currentDirection = "down"; 
     } 
    } 
    if (keys.moveLeft) { 
     playerTwo.x -= powerUps.speed; 
     if (playerTwo.currentDirection != "left") { 
      playerTwo.gotoAndPlay('left') 
      playerTwo.currentDirection = "left"; 
     } 
    } 
    if (keys.moveRight) { 
     playerTwo.x += powerUps.speed; 
     if (playerTwo.currentDirection != "right") { 
      playerTwo.gotoAndPlay('right') 
      playerTwo.currentDirection = "right"; 
     } 
    } 
    if (keys.moveUp) { 
     playerTwo.y -= powerUps.speed; 
     if (playerTwo.currentDirection != "up") { 
      playerTwo.gotoAndPlay('up') 
      playerTwo.currentDirection = "up"; 
     } 
    } 
    if (keys.moveDown) { 
     playerTwo.y += powerUps.speed; 
     if (playerTwo.currentDirection != "down") { 
      playerTwo.gotoAndPlay('down') 
      playerTwo.currentDirection = "down"; 
     } 
    } 
}

來源

2017-06-05 Thomas Hermansen

一些HTML請 –

是否使用'x'和'y'值可以更新位置？ – Arg0n

keydown事件處理程序應該工作。這個問題必須在別處。例如。以'keys'變量的設置方式。你永遠不會分配任何東西或改變該變量。 –

這只是一個Tipp沒有答案 - 但在評論中的地方是不夠的。

我認爲that's不是一個很好的方式與您的「如果」建設，爲更簡單的方法的例子：

<!doctype html> 
 
    <html lang="en"> 
 
    <head> 
 
    <meta charset="UTF-8"> 
 
    <title>Table key´s</title> 
 
    <style> 
 
     td{width:10px;height:10px;background:#ddd;} 
 
     tr:nth-child(5) td:nth-child(5){background:#f00;} 
 
    </style> 
 
    </head> 
 
    <body> 
 
    <div id="tableContainer"> 
 
    </div> 
 
    <script>  
 
     var row=col=5,max=10; 
 
     tableContainer.innerHTML = '<table>'+('<tr>'+'<td>'.repeat(max)).repeat(max)+'</table>'; 
 
     window.addEventListener("keyup", function(e){ 
 
     var colDiff, rowDiff; 
 
     var keyMap = new Map([[37,[-1,0]],[38,[0,-1]],[39,[1,0]],[40,[0,1]]]); 
 
     if (keyMap.has(e.keyCode)){ 
 
      document.querySelector(`tr:nth-child(${row}) td:nth-child(${col})`).style.background='#ddd'; 
 
      [colDiff,rowDiff]=keyMap.get(e.keyCode); 
 
      row+=rowDiff; 
 
      col+=colDiff; 
 
      row = (row>max) ? max : (row < 1) ? 1 : row; 
 
      col = (col>max) ? max : (col < 1) ? 1 : col; 
 
      document.querySelector(`tr:nth-child(${row}) td:nth-child(${col})`).style.background='#f00'; 
 
     } 
 
     }) 
 
    </script> 
 
    </body> 
 
    </html>

來源

2017-06-05 11:29:11

請注意'repeat（）'和'Map（）'的瀏覽器支持有限 – charlietfl

Javascript移動球員與密鑰

回答

相關問題