2012-04-12 116 views
2

我有一個硬幣翻轉程序,我正在做一個循環。問題在於它似乎很早就退出了。看一看。Javascript退出循環提前

$(function() { 
    $('#rollDice').click(function() { 

     var e = document.getElementById("diceSides"); 
     var diceSides = e.options[e.selectedIndex].text; 
     var diceRolls = document.getElementById('rollCount').value; 

     if (diceRolls.match(/^[\d]*$/)) {  
      if (diceRolls == "") { 
       alert ("Please fill out all forms then try again."); 

      } else { 

       $('#diceRollContainer').slideDown('slow'); 

       for (i=0;i<diceRolls;i++) { 
        var randNum = Math.floor(Math.random()*diceSides)+1; 
        var rolls = ("You rolled a " + diceSides + " sided die " + diceRolls + " times, and got the numbers "); 

        rollMinOne = rolls - 1; 
        if (i == rollMinOne) { 
         var rolls = (rolls + randNum + "."); 
        } 
        var rolls = (rolls + randNum + ", "); 

       } 
       alert (rolls); 
      } 
     } else { 
      alert ("Make sure you only enter numbers and no spaces, then try again."); 
     } 
    }); 
}); 

的問題是,程序提醒輥之前在for循環似乎完成。它爲什麼這樣做?

+0

如果你做console.log(diceRolls),它的價值是什麼? – tcole 2012-04-12 03:11:37

+0

它的價值是10. – 2012-04-12 03:13:24

+1

它提醒什麼,你期望什麼?看着這個,我希望看到類似於'你擲了一個4面的骰子3次,並得到了數字1,2,3.3,' – 2012-04-12 03:15:20

回答

2

你必須在代碼中的幾個錯誤,但解釋你所看到的行爲之一是,你重置每次通過循環到初始字符串的值爲rolls

一旦移出該行,你會得到一個更接近價值,但你也計算從rolls,而不是diceRollsrollsMinOne,如您預期的(這就是爲什麼好名字是非常重要的),這意味着如果語句從來沒有(因爲一個字符串減去一個數字是值NaN「不是一個數字」,這不等於什麼 [甚至本身!])。

然後,唯一的功能(而不是樣式或設計)問題是,您在最後添加了一個帶有逗號的值,即使您已經添加了句點。

全部放在一起:

var rolls = ("You rolled a " + diceSides + " sided die " + diceRolls + " times, and got the numbers "); 
    for (i=0;i<diceRolls;i++) { 
     var randNum = Math.floor(Math.random()*diceSides)+1; 

     rollMinOne = diceRolls - 1; 
     if (i == rollMinOne) { 
      rolls = (rolls + randNum + "."); 
     } else { 
      rolls = (rolls + randNum + ", "); 
     } 

雖然與其他答案提到,有更容易和更快的方式來得到相同的結果,我覺得理解爲什麼代碼不能正常工作是非常重要的。

+0

謝謝,這就是我正在尋找的東西,我想了解它。此外,無論如何,這只是實踐。 – 2012-04-12 03:53:51

0

我覺得無聊,並實施了代碼,這似乎是用最少的測試工作

<script> 
    $(function() { 
     $('#rollDice').click(function() { 

      var diceSides = $('#dice-sides').val(); 
      var diceRolls = $('#roll-count').val(); 

      if (diceRolls.match(/^[\d]*$/)) {  
       if (diceRolls == "") { 
        alert ("Please fill out all forms then try again."); 

       } else { 
        $('#output').text(
         "You rolled a " + diceSides + 
         " sided die " + diceRolls + 
         " times, and got the numbers "); 

        for (i=0; i<diceRolls; i++) { 

         var randNum = Math.floor(Math.random()*diceSides)+1; 

         $('#output').append(randNum); 
        } 
       } 
      } else { 
       alert ("Make sure you only enter numbers and no spaces, then try again."); 
      } 
     }); 
    }); 
</script> 
<form onsubmit="return false;"> 
    <label>Sides</label> 
    <input id="dice-sides" type="text" value="6"> 
    <label>Count</label> 
    <input id="roll-count" type="text" value="1"> 
    <button id="rollDice">Roll</button> 
</form> 
Rolls 
<div id="output"> 

</div> 
+0

它會在沒有onsubmit的情況下工作 - 「返回false」? – 2012-04-12 03:41:52