2017-04-22 12 views
-1

Je suis encore nouveau en JavaScript. J'essaye de faire un programme qui contient 2 boutons et une fois qu'un bouton est cliqué, il crée un nombre au hasard. Le problème est que lorsque j'essaie de les comparer, cela ne montre pas lequel est le plus grand. J'ai d'abord pensé que le problème est que les variables ne sont pas globales mais qu'elles n'ont rien changé.Le programme ne fonctionne pas

Quelqu'un peut-il m'aider à trouver le problème s'il vous plaît?

Voici le code JavaScript :

var par1 = document.getElementById("para1"); 
 
var par2 = document.getElementById("para2"); 
 
var winner = document.getElementById("win"); 
 
    
 
function button1() { 
 
    num1 = Math.floor(Math.random() * 7); 
 
    par1.innerHTML = num1; 
 
} 
 
    
 
function button2() { 
 
    num2 = Math.floor(Math.random() * 7); 
 
    par2.innerHTML = num2; 
 
} 
 
if (num1 > num2) { 
 
    winner.innerHTML = "the winner is player 1"; 
 
} else { 
 
    winner.innerHTML = "the winner is player 2"; 
 
}
<!DOCTYPE html> 
 
<html> 
 
    
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>dicestimulator</title> 
 
    <link rel="stylesheet" href="dicestimulator.css"> 
 
</head> 
 
    
 
<body> 
 
    <div class="container"> 
 
     <div> 
 
      <h1>Player1</h1> 
 
      <button type="button" name="button1" onclick="button1()" id="but1">roll 
 
    dice</button> 
 
      <p id="para1">Click the button to see what you get</p> 
 
     </div> 
 
     <div> 
 
      <h1>Player2</h1> 
 
      <button type="button" name="button2" id="but2" onclick="button2()">roll 
 
    dice</button> 
 
      <p id="para2">Click the button to see what you get</p> 
 
     </div> 
 
     <p id="win">let's see who wins!!!</p> 
 
     <script src="dicestimulator.js"></script> 
 
    </div> 
 
</body> 
 
    
 
</html>

Répondre

1
if(num1>num2){ 
winner.innerHTML="the winner is player 1"; 
}else{ 
winner.innerHTML="the winner is player 2"; 
} 

Vous n'appelez pas le bloc ci-dessus dans votre code HTML.

Ma solution pour vous faire un troisième bouton qui appelle la fonction getwinner

function getWinner() { 
if(par1.val>par2.val){ 
winner.innerHTML="the winner is player 1"; 
} else{ 
winner.innerHTML="the winner is player 2"; 
} 
} 

S'il vous plaît noter que vous ne pouvez pas appeler des variables locales créées dans les fonctions en dehors de ces fonctions. num1 et num2 cessent d'exister après la portée de la fonction qui les a créés.

1

La section de code:

if(num1>num2){ 
winner.innerHTML="the winner is player 1"; 
}else{ 
winner.innerHTML="the winner is player 2"; 
} 

... est pas à l'intérieur d'une fonction.

Il s'exécute lors du chargement initial du script. Par la suite, vous appelez les fonctions button1 et button2. Ceux-ci changent les valeurs de num1.

Vous ne comparez jamais les valeurs nouveau.

Si vous souhaitez les comparer lorsque les fonctions button1 et button2 s'exécutent, le code doit être appelé lorsque ces fonctions le sont.