js只在某個時間執行？

我寫這段代碼做一個基本的遊戲。完整的HTML是：js只在某個時間執行？

<!DOCTYPE> 
<html> 
    <head> 
     <title>The dodge game</title> 
     <link rel="stylesheet" type="text/css" href="normalize.css"> 
     <link rel="stylesheet" type="text/css" href="index.css"> 
     <script src="jquery.js"></script> 
     <script src="script.js"></script> 
    </head> 
    <body> 
     <div id="play-ground"> 
     <div id="character"></div> 
     <div id="chaser"></div> 
     </div> 
     <button id="control-up" class="button">UP</button> 
     <button id="control-down" class="button">DOWN</button> 
     <button id="control-right" class="button">RIGHT</button> 
     <button id="control-left" class="button">LEFT</button> 
    </body> 
</html>

腳本：

$(document).ready (
    function() { 
     var characterPositionLeft = 0; 
     var characterPositionTop = 0; 
     var chaserPositionLeft = 810; 
     var chaserPositionTop = 630; 
     var speed = 30; 
     var dspeed = 60; 
     var apoint = 5; 
     var testPositionLeft = function() { 
      if (chaserPositionLeft > characterPositionLeft) { 
       chaserPositionLeft -= 30; 
       var caLeft = chaserPositionLeft + 'px'; 
       $('#chaser').css('margin-left', caLeft); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       console.log(chaserPositionLeft); 
      } else if (chaserPositionLeft < characterPositionLeft) { 
       chaserPositionLeft += 30; 
       var caLeft = chaserPositionLeft + 'px'; 
       $('#chaser').css('margin-left', caLeft); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       console.log(characterPositionLeft); 
      } 
     } 
     var testPositionTop = function() { 
      if (chaserPositionTop > characterPositionTop) { 
       chaserPositionTop -= 30; 
       var caTop = chaserPositionTop + 'px'; 
       $('#chaser').css('margin-top', caTop); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       console.log(chaserPositionTop); 
      } else if (chaserPositionTop < characterPositionTop) { 
       chaserPositionTop += 30; 
       var caTop = chaserPositionTop + 'px'; 
       $('#chaser').css('margin-top', caTop); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       console.log(chaserPositionTop); 
      } 
     } 
     // left and right 
     var CacLeftPlus = chaserPositionLeft + 30; 
     var CacLeftMinus = chaserPositionLeft - 30; 
     var LeftCaught = false; 
     // top and bottom 
     var CacTopPlus = chaserPositionTop + 30; 
     var CacTopMinus = chaserPositionTop - 30; 
     var TopCaught = false; 
     // up 
     $('#control-up').click ( 
      function() { 
       testPositionTop(); 
       if(characterPositionTop > 0) { 
       characterPositionTop -= speed; 
       var cTop = characterPositionTop + 'px'; 
       console.log(characterPositionTop); 
       $('#character').css('margin-top', cTop); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       } else { 
        console.log('warning: [reached sky limit]'); 
       } 
      } 
     ) 
     // down 
     $('#control-down').click ( 
      function() { 
       testPositionTop(); 
       if(characterPositionTop < 630) { 
       characterPositionTop += speed; 
       var cTop = characterPositionTop + 'px'; 
       console.log(characterPositionTop); 
       $('#character').css('margin-top', cTop); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       } else { 
        console.log('warning: [reached earth limit]'); 
       } 
      } 
     ) 
     // right 
     $('#control-right').click ( 
      function() { 
       testPositionLeft(); 
       if(characterPositionLeft < 810) { 
       characterPositionLeft += speed; 
       var cTop = characterPositionLeft + 'px'; 
       console.log(characterPositionLeft); 
       $('#character').css('margin-left', cTop); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       } else { 
        console.log('warning: [reached right limit]'); 
       } 
      } 
     ) 
     // left 
     $('#control-left').click ( 
      function() { 
       testPositionLeft(); 
       if(characterPositionLeft > 0) { 
       characterPositionLeft -= speed; 
       var cTop = characterPositionLeft + 'px'; 
       console.log(characterPositionLeft); 
       $('#character').css('margin-left', cTop); 
       leftRight(); 
       topBottom(); 
       testEndGame(); 
       } else { 
        console.log('warning: [reached left limit]'); 
       } 
      } 
     ) 
     var leftRight = function() { 
      if(characterPositionLeft == CacLeftPlus || characterPositionLeft == CacLeftMinus) { 
       LeftCaught = true; 
       console.log('worked?'); 
      } else { 

      } 
     } 
     var topBottom = function() { 
      if(characterPositionTop == CacTopPlus || characterPositionLeft == CacTopMinus) { 
       TopCaught = true; 
       console.log('worked?'); 
      } else { 

      } 
     } 
     var testEndGame = function() { 
      if (LeftCaught == true && TopCaught == true) { 
      console.log('game over'); 
      alert('game over'); 
     } else { 

     } 
     } 
    } 
)

一切工作正常，直到功能左右改變，upBottom和testEndGame。他們只有控制檯在控制檯被記錄爲600和630時才工作。任何人都可以告訴我這個代碼中的缺陷並解決這個問題的方法嗎？下面是完整的代碼：http://jsfiddle.net/StK7r/1/

來源

2013-10-10 Haiz

我相信你想

if(characterPositionTop == CacTopPlus || characterPositionLeft == CacTopMinus) {

，而不是測試

if(characterPositionTop <= CacTopPlus && characterPositionTop >= CacTopMinus) {

，因爲你想你的角色在一個盒子裏被抓。左邊相同。此外，您正在測試您的「頂」位置與「左」位置。

以後編輯：

我已經更新了小提琴。我也注意到了這一點：

 // left and right 
    var CacLeftPlus = chaserPositionLeft + 30; 
    var CacLeftMinus = chaserPositionLeft - 30; 
    var LeftCaught = false; 
    // top and bottom 
    var CacTopPlus = chaserPositionTop + 30; 
    var CacTopMinus = chaserPositionTop - 30;

當chaserPositionTop/Left改變時，你沒有更新這些變量。他們在這裏受到價值的約束，顯然他們永遠保持着你在初始化者中賦予他們的價值。

來源

2013-10-10 12:52:25 qternion

+1瞭解（我認爲）遊戲應該做什麼，我只是勉強理解代碼:) – Nunners

+1，每次我想添加一些代碼，我必須再次讀取它 – Haiz

仍然不起作用，不知道爲什麼 – Haiz

js只在某個時間執行？

回答

相關問題