Nelze změnit výchozí hodnotu číslo vstupu v Javascriptu

Question 1

Já používám Javascript (nejsou obeznámeni s rámců, jako Úhlové jen zatím), a snaží se získat a zobrazení hodnoty číslo vstupu z mé HTML, ale když jsem spustit funkci, která to udělá, výchozí hodnota "1" z HTML se zdá být pouze jeden, i když jsem se změnit vstup na samotné webové stránky, řekněme, 10 kliknutím na šipky.

Myslím, že jsem napsal kód správně tak daleko, jak je syntaxe jde, takže moje jediná myšlenka je, že snad vstup musí být zabalené v podobě nějakého druhu, a tlačítko "roll" se změnil na type="submit"?

Tady je odkaz na codepen s nefunkční kód, a některé úryvky ze zúčastněných kusů níže.

var displayScreen = document.getElementById("display-message");
var rollButton = document.getElementById("roll-button");

//Variable to tell the rollDice() function how many times to roll dice.
var numDice = document.getElementById("num-dice").value;

//Dice Array to hold the results of the rollDice() function, gets cleared after each use.
var diceTotal = [];

//Event listener for the "roll" button
rollButton.addEventListener("click", rollDice);

//Make this function display a roll result
function displayMessage() {

  displayScreen.innerText = diceTotal[0];
}

//Generate a random number between 1 and diceType, and set the rolledNumber variable to its result
function rollDice() {

  //Nothing currently changes numDice, so it keeps default value="1".

  result = 0;
  var roll = Math.floor(Math.random() * diceType) + 1;

  for (var i = 0; i < numDice; i++) {
    result += roll;
  }

  diceTotal[0] = result;

  displayMessage();
}

<div id="dice-display-div">

  <!--
                We want to display the dice roll total, any applied bonuses, and then the final total
                together in this div, possibly as separate <h2> elements.
            -->

  <h2 id="display-message">Click "Roll" to Begin</h2>

</div>

<div id="roll-button-div">

  <label class="roll-button-label" for="num-dice" id="num-dice-label">Number of Dice: </label>
  <input class="roll-button-item" type="number" id="num-dice" name="num-dice" value="1" min="1" max="10">

  <label class="roll-button-label" for="bonus" id="bonus-label">Bonus (or Negative): </label>
  <input class="roll-button-item" type="number" id="bonus" name="bonus" value="0" min="-10" max="10">

  <button class="roll-button-item" id="roll-button">Roll</button>

</div>

Question 2

Za prvé, měli byste zavolat své Matematické.random() uvnitř pro smyčky, jinak budete jen náhodně vygenerovat číslo, a všechny vaše kostky bude mít stejné číslo. Za druhé, měli byste přiřadit numDice uvnitř své funkce, takže to výsledky a přiřadí aktuální hodnotu místo na začátku stránky render:

var displayScreen = document.getElementById("display-message");
var rollButton = document.getElementById("roll-button");



//Dice Array to hold the results of the rollDice() function, gets cleared after each use.
var diceTotal = [];

//Event listener for the "roll" button
rollButton.addEventListener("click", rollDice);

//Make this function display a roll result
function displayMessage() {

    displayScreen.innerText = diceTotal[0];
}

//Generate a random number between 1 and diceType, and set the rolledNumber variable to its result
function rollDice() {
   //Variable to tell the rollDice() function how many times to roll dice.
   var numDice = document.getElementById("num-dice").value; //assign this upon function call so it checks it each time the button is clicked to get the latest value
   //Nothing currently changes numDice, so it keeps default value="1".

   result = 0;
   var roll = 0

   for (var i = 0; i < numDice; i++) {
       roll =  Math.floor(Math.random() * diceType) + 1; //call random on each dice roll
       result += roll;
   }

   diceTotal[0] = result;

  displayMessage();
}

Ryan Millares · Answer 1 · 2021-11-22T23:47:06

Za prvé, měli byste zavolat své Matematické.random() uvnitř pro smyčky, jinak budete jen náhodně vygenerovat číslo, a všechny vaše kostky bude mít stejné číslo. Za druhé, měli byste přiřadit numDice uvnitř své funkce, takže to výsledky a přiřadí aktuální hodnotu místo na začátku stránky render:

var displayScreen = document.getElementById("display-message");
var rollButton = document.getElementById("roll-button");



//Dice Array to hold the results of the rollDice() function, gets cleared after each use.
var diceTotal = [];

//Event listener for the "roll" button
rollButton.addEventListener("click", rollDice);

//Make this function display a roll result
function displayMessage() {

    displayScreen.innerText = diceTotal[0];
}

//Generate a random number between 1 and diceType, and set the rolledNumber variable to its result
function rollDice() {
   //Variable to tell the rollDice() function how many times to roll dice.
   var numDice = document.getElementById("num-dice").value; //assign this upon function call so it checks it each time the button is clicked to get the latest value
   //Nothing currently changes numDice, so it keeps default value="1".

   result = 0;
   var roll = 0

   for (var i = 0; i < numDice; i++) {
       roll =  Math.floor(Math.random() * diceType) + 1; //call random on each dice roll
       result += roll;
   }

   diceTotal[0] = result;

  displayMessage();
}

Nelze změnit výchozí hodnotu číslo vstupu v Javascriptu

Otázka

Nejlepší odpověď

V jiných jazycích

Tato stránka je v jiných jazycích

Populární v této kategorii

Oblíbené položky v této kategorii