2016-04-14 9 views
0

Ich kann nicht verstehen, warum dies stürzt ab, wenn ich die Eingabe des Benutzers der Variablen "Finger" zuweisen. Ich habe jeden Teil des Codes durch Alarmierung getestet, und alles scheint in Ordnung zu sein. Ich habe auch festgestellt, dass es gut funktioniert, wenn ich der Variablen im Skript eine Zahl zuweise.Javascript: Absturz, wenn Variable von Benutzereingabe zugewiesen wird

Ich dachte, dass es sein könnte, dass der Eingabewert als String gelesen wurde, also im Vergleich zu einer Zahl niemals gleich wäre und das Skript in eine Endlosschleife übergehen würde. Also habe ich das Eingabefeld als Typ: Nummer zugewiesen, und es stürzt immer noch ab.

Wer denkt an jemanden?

<html> 

     <head> 
      <title> How Many Fingers - Computer Guesser </title> 
     </head> 

     <body> 

      <h1> How many fingers? </h1> 

      <input id='fingersInput' type='number' min='1' max='10' placeholder="Insert the number of fingers here." /> 

      <button id='check'> Go! </button> 

      <hr> </hr> 
      <p id='computerGuessesOutput'> </p> 
      <p id='allguessesOutput'> </p> 

     <script type='text/javascript'> 

      document.getElementById('check').onclick = function() { 

       var fingers = document.getElementById('fingersInput').value; 

       //var fingers = 5; 

       var computerGuesses = Math.floor(Math.random() * 11); 

       var numberOfGuesses = 1; 

       var allguesses = [computerGuesses]; 

       while (fingers !== computerGuesses) { 
        computerGuesses = Math.floor(Math.random() * 11); 

        numberOfGuesses++; 

        allguesses.push(computerGuesses); 

         } 

       document.getElementById('computerGuessesOutput').innerHTML = numberOfGuesses; 
       document.getElementById('allguessesOutput').innerHTML = allguesses; 

      } 



     </script> 

     </body> 
    </html> 
+0

Was versuchen Sie zu erreichen? Bitte erläutern Sie den Kontext für Klarheit. –

Antwort

1

Wenn Sie vergleichen mit! ==, ist es nicht nur von Wert zu vergleichen, sondern nach Art, in diesem Fall Finger ist eine Zeichenfolge, während computerGuesses eine Zahl ist.

könnten Sie entweder konvertieren ‚Finger‘ zuerst an die Nummer, unter Verwendung von parseInt() oder vergleichen mit! =

Sie dies eindeutig die Art in der Konsole Druck mehr sehen kann. Check this out:

document.getElementById('check').onclick = function() { 
 
    var fingers = document.getElementById('fingersInput').value; 
 
    var computerGuesses = Math.floor(Math.random() * 11); 
 
    var numberOfGuesses = 1; 
 
    var allguesses = [computerGuesses]; 
 
    console.log(fingers, computerGuesses); 
 
    console.log(typeof fingers, typeof computerGuesses); 
 

 
}
<html> 
 

 
    <head> 
 
    <title> How Many Fingers - Computer Guesser </title> 
 
    </head> 
 

 
    <body> 
 

 
    <h1> How many fingers? </h1> 
 

 
    <input id='fingersInput' type='number' min='1' max='10' placeholder="Insert the number of fingers here." /> 
 

 
    <button id='check'> Go! </button> 
 

 
    <hr> </hr> 
 
    <p id='computerGuessesOutput'></p> 
 
    <p id='allguessesOutput'></p> 
 
    </body> 
 
</html>

-1

Zuerst ist es ein Eingang, so dass Sie es als Text bekommen, wie Sie gesagt haben. Das type Attribut ist für die Anzeige und Validierung, es wird immer eine Zeichenkette sein, Da Sie eine Zahl möchten, sollten Sie eine parseInt tun, um das Ergebnis in eine ganze Zahl zu werfen.

Dann überprüfen Sie nicht, ob Ihr Fingerwert im zufälligen Bereich liegt (1-11 in Ihrem Beispiel), so dass jede Zahl außerhalb dieses Bereichs eine Endlosschleife verursacht.