擲骰子直到達到數字
[英]Dice roll until number is reached
問題描述
我正在學習javascript，我的項目要求我建立一個有兩個骰子圖像，一個輸入框和一個按鈕的網頁。 在給出輸入后，可以按下按鈕，javascript將告訴您獲取該值所需的卷數，並且骰子圖像將顯示該值。 我的麻煩是，我無法顯示總數，我沒有得到正確的數量。 它總是說需要1卷。
//define a Dice object, properties and methods var Dice = { sides: 6, rollDie: function(diceElement) { var rolledValue = Math.floor(Math.random() * this.sides) + 1; var diceImage = this.getURL(rolledValue); diceElement.attr("src", diceImage); }, rollDice: function() { var diceTotal = 0; diceTotal += this.rollDie($('#dice1')); diceTotal += this.rollDie($('#dice2')); return diceTotal; }, rollDoubles: function(n) { var die1 = 0; var die2 = 0; var numRolls = 0; do { die1 = this.rollDie($('#dice1')); die2 = this.rollDie($('#dice2')); numRolls++; } while(!(die1 == die2 && die1 == n)); return numRolls; }, URL_prefix: "http://dave-reed.com/book3e/Images/", getURL: function(n) { //return the URL for an n-dot die return this.URL_prefix + "die" + n + ".gif"; } }; //top-level function function roll_number(n) { var die1 = Math.floor(Math.random() * Dice.sides) + 1; var die2 = Math.floor(Math.random() * Dice.sides) + 1; var dicetotal = die1 + die2; var numRolls = 0; //roll two dice until you hit n do { die1 = Dice.rollDie($('#dice1')); die2 = Dice.rollDie($('#dice2')); numRolls++; } while(dicetotal == n); return numRolls; //return the number of rolls } function getRoll () { var number = parseFloat($("#num").val()); var numRolls = roll_number(number); $("#time").text( "You rolled " + number + " in " + numRolls + " rolls"); } $(document).ready(function(){ $("#R").on("click", getRoll); //$("#roll").on("click", Dice.getURL); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <!Doctype html> <html> <head> <title>Dice-namic</title> <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="Dice-namic.js"></script> </head> <body> <h2>Roll Number</h2> <img id="dice1" src="http://www.dave-reed.com/book3e/Images/die1.gif"> <img id="dice2" src="http://www.dave-reed.com/book3e/Images/die1.gif"> <p>Enter target number:</p> <input type="text" id="num"> <br> <br> <button id="R">Roll 'em!</button> <br> <br> <div id="time">Test</div> </body> </html>
3 個解決方案
解決方案1
0 2016-03-05 04:05:48
問題出在roll_number ：
function roll_number(n) {
var die1 = Math.floor(Math.random() * Dice.sides) + 1;
var die2 = Math.floor(Math.random() * Dice.sides) + 1;
var dicetotal = die1 + die2;
var numRolls = 0;
do {
die1 = Dice.rollDie($('#dice1'));
die2 = Dice.rollDie($('#dice2'));
dicetotal = die1 + die2; // and recalculate dicetotal here
numRolls++;
} while(dicetotal == n); // this should be while(dicetotal != n)
return numRolls;
}
同樣在Dice.rollDie你最后應該return rolledValue 。
解決方案2
0 已采納 2016-03-05 04:10:09
//define a Dice object, properties and methods var Dice = { sides: 6, rollDie: function(diceElement) { var rolledValue = Math.floor(Math.random() * this.sides) + 1; var diceImage = this.getURL(rolledValue); diceElement.attr("src", diceImage); return rolledValue;//added this line; }, rollDice: function() { var diceTotal = 0; diceTotal += this.rollDie($('#dice1')); diceTotal += this.rollDie($('#dice2')); return diceTotal; }, rollDoubles: function(n) { var die1 = 0; var die2 = 0; var numRolls = 0; do { die1 = this.rollDie($('#dice1')); die2 = this.rollDie($('#dice2')); numRolls++; } while(!(die1 == die2 && die1 == n)); return numRolls; }, URL_prefix: "http://dave-reed.com/book3e/Images/", getURL: function(n) { //return the URL for an n-dot die return this.URL_prefix + "die" + n + ".gif"; } }; //top-level function function roll_number(n) { var die1 = Math.floor(Math.random() * Dice.sides) + 1; var die2 = Math.floor(Math.random() * Dice.sides) + 1; var dicetotal = die1 + die2; var numRolls = 0; //roll two dice until you hit n do { die1 = Dice.rollDie($('#dice1')); die2 = Dice.rollDie($('#dice2')); dicetotal=die1+die2;//added this line numRolls++; } while(dicetotal != n); //modified return numRolls; //return the number of rolls } function getRoll () { var number = parseFloat($("#num").val()); var numRolls = roll_number(number); $("#time").text( "You rolled " + number + " in " + numRolls + " rolls"); } $(document).ready(function(){ $("#R").on("click", getRoll); //$("#roll").on("click", Dice.getURL); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <!Doctype html> <html> <head> <title>Dice-namic</title> <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="Dice-namic.js"></script> </head> <body> <h2>Roll Number</h2> <img id="dice1" src="http://www.dave-reed.com/book3e/Images/die1.gif"> <img id="dice2" src="http://www.dave-reed.com/book3e/Images/die1.gif"> <p>Enter target number:</p> <input type="text" id="num"> <br> <br> <button id="R">Roll 'em!</button> <br> <br> <div id="time">Test</div> </body> </html>
我修改了代碼。 你沒有返回骰子播放后的值。 對while循環使用否定。 你沒有改變總價值。
解決方案3
0 2016-03-05 04:17:23
這里有幾個問題。 從roll_number函數開始，在do while循環中不會重新計算dicetotal 。 其次，將你帶出循環的條件是dicetotal == n 。 你實際上想要相反：循環，而dicetotal不同於你想要滾動的n 。 最后， rollDie函數將更改顯示的圖像，但不會返回滾動值。
rollDie應該像：
rollDie: function(diceElement) {
var rolledValue = Math.floor(Math.random() * this.sides) + 1;
var diceImage = this.getURL(rolledValue);
diceElement.attr("src", diceImage);
return rolledValue;
}
和roll_number應該是這樣的：
function roll_number(n) {
var dicetotal; //No need to set a total as the first total will be done in the loop
var numRolls = 0;
do {
dicetotal = Dice.rollDie($('#dice1')) + Dice.rollDie($('#dice2'));
numRolls++;
} while(dicetotal != n);
return numRolls;
}
編寫一個程序來“擲骰子”需要接受一個數字和滾動次數然后輸出那么多的數字1-6
[英]writing a program to “roll a dice” needs to accept a number and roll number of times then output that many numbers of 1-6
在骰子擲骰事件監聽器中，如何在新骰子圖像加載完畢后延遲警報？
[英]Within a dice roll event listener, how can I delay an alert until after the new dice images have loaded?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.