J'apprends le javascript et mon projet m'oblige à construire une page web qui a deux images de dés, une zone de saisie et un bouton. Une fois qu'une entrée est donnée, le bouton peut être poussé et le javascript vous dira combien de rouleaux il a fallu pour obtenir cette valeur et les images de dés afficheront cette valeur. Mon problème est que je ne peux pas obtenir les dés pour afficher le total et que je n'obtiens pas le bon nombre de lancers. Il dit toujours qu'il a fallu 1 rouleau.

//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
zgarcia 5 mars 2016 à 06:31

3 réponses

Meilleure réponse
//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>

J'ai modifié le code. vous ne retournez pas la valeur qui est venue après que les dés aient été joués. utiliser la négation pour la boucle while. vous ne modifiez pas la valeur totale.

0
Sambi Reddy 5 mars 2016 à 04:10

Il y a plusieurs problèmes ici. En commençant par la fonction roll_number, le dicetotal n'est pas recalculé dans la boucle do while. Deuxièmement, la condition qui vous ferait sortir de la boucle est quand dicetotal == n. Vous voulez en fait le contraire: boucle alors que dicetotal est différent de n que vous essayez de rouler. Enfin, la fonction rollDie changera l'image affichée, mais elle ne vous renverra pas la valeur laminée.

rollDie devrait ressembler à:

 rollDie: function(diceElement) {
     var rolledValue = Math.floor(Math.random() * this.sides) + 1;
     var diceImage = this.getURL(rolledValue);
     diceElement.attr("src", diceImage);
     return rolledValue;
 }

Et roll_number devrait ressembler à ceci:

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;
}
0
The_Black_Smurf 5 mars 2016 à 04:24

Le problème est dans 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;
}

Également dans Dice.rollDie, vous devriez return rolledValue à la fin.

0
wong2 5 mars 2016 à 04:11