Basic Javascript onclick

hier ist mein Code, ganz neu in der Codierung versuchen, die Box "Punkte", um die Summe von PointSum, wenn "Ben" ist in die Box "Gewinner" eingegeben zurückzugeben. Ich versuche nur, an einigen Grundlagen mit diesem Projekt zu arbeiten. Der Versuch, eine Klammer der Art zu machenBasic Javascript onclick

<HTLML> 
<head> 
    <script> 
     var pointSum = 0; 
     var firstRound = 20; 
     var secondRound = 50; 
     var thirdRound = 100; 
     var fourthRound = 150; 
     var fifthRound = 250; 
     var finalRound = 300; 
     var winnerOne = false; 
     var winnerTwo = false; 
     var winnerThree = false; 
     var winnerFour = false; 
     var winnerFive = false; 
     var winnerSix = false; 

     if (winnerOne = true){ 
      pointSum+=firstRound 
     } else if (winnerTwo = true){ 
      pointSum+=secondRound 
     } else if (winnerThree = true){ 
      pointSum+=thirdRound   
     } else if (winnerFour = true){ 
      pointSum+=fourthRound 
     } else if (winnerFive = true){ 
      pointSum+=fifthRound 
     } else if (winnerSix = true){ 
      pointSum+=finalRound 
     else 

     function tally() {if document.getElementById('winner') == "Ben" { winnerOne = true; 
      } 
        pointSum=document.getElementById("points").value; 
     } 
    </script> 
</head> 
<body> 
    <form> 
     Winner: 
     <input type="text" name="winner" id="winner" size="20"> 
     Points: 
     <input type="text" name="points" id="points" size="20"> 
     Submit 
     <button type= "button" onclick="tally()">Tally points</button> 

    </form> 
</body> 
</html>

UPDATE ***** neuer Code, besser zu werden, nicht Konsole Fehler Rückkehr aber noch nicht in der „Punkte“ -Box immer etwas tally beim Anklicken

<HTLML> 
<head> 
    <script> 
     var pointSum = 0; 
     var firstRound = 20; 
     var secondRound = 50; 
     var thirdRound = 100; 
     var fourthRound = 150; 
     var fifthRound = 250; 
     var finalRound = 300; 
     var winnerOne = false; 
     var winnerTwo = false; 
     var winnerThree = false; 
     var winnerFour = false; 
     var winnerFive = false; 
     var winnerSix = false; 

     function tally() { 
      var winner = document.getElementById("winner").value; 
      var firstWinner = "Ben"; 
      if (winner == firstWinner){ 
       winnerOne == true; 
      } 
       pointSum = document.getElementById("points").value;  
     }   

     if (winnerOne == true){ 
      pointSum+=firstRound; 
     } else if (winnerTwo){ 
      pointSum+=secondRound; 
     } else if (winnerThree){ 
      pointSum+=thirdRound; 
     } else if (winnerFour){ 
      pointSum+=fourthRound; 
     } else if (winnerFive){ 
      pointSum+=fifthRound; 
     } else if (winnerSix){ 
      pointSum+=finalRound; 
     } 
    </script> 
</head> 
<body> 
    <form> 
     Winner: 
     <input type="text" name="winner" id="winner" size="20"> 
     Points: 
     <input type="text" name="points" id="points" size="20"> 
     Submit 
     <button type= "button" onclick="tally()">Tally points</button> 

    </form> 
    <div class="updatePoints"> 
    </div> 
</body> 
</html>

Quelle

2016-03-29 Ben Mohler

Sie ordnen alle Ihre "Gewinner" Variablen zu. Ändere 'winnerOne = true' zu' winnerOne == true' oder nur 'winnerOne'. Wiederholen Sie dies für alle anderen 'if'-Bedingungen, die Sie gerade ausführen. '=' dient zum Zuweisen von Werten, '==' und '===' dient zum Vergleichen von Werten. Öffne auch deine Konsole (drücke F12). Sie haben einige Syntaxfehler in Ihrer "Tally" -Funktion. Schließlich wird der Wert sofort summiert. Sie sollten Ihren gesamten Summierungscode in Ihre "Tally" -Funktion einfügen. –

Ihr Code hat ein paar Fehler, lassen Sie es ein wenig ändern!

Zuerst müssen Sie ‚Wert‘ atribbute Ihres Gewinner Element in Ihrer if-Anweisung für den Zugriff auf und die Surround alle die Aussage in Klammern

function tally() { 
    if (document.getElementById('winner').value == "Ben"){ 
     winnerOne = true; 
    } 
    pointSum = document.getElementById("points").value; 
}

Zweitens Sie ‚==‘ verwenden Vergleich zu machen, Sie Verwenden Sie '=', bedeutet dies, dass Sie Variablen zugewiesen sind, und Sie vergessen, ';' am Ende der Zeilen! Ändern Sie diesen Teil:

if (winnerOne == true){ 
    pointSum+=firstRound; 
}

setzen Sie alle Ihre if/else wie im obigen Beispiel!

Hinweis: Wenn Sie verwenden if-Anweisung Sie wie folgt verwenden können:

if (winnerOne){ //you can omit == true, because if winnerOne is true, it will enter ind the if statement 
    //will enter here if winnerOne is true 
} 

if (!winnerOne){ //you can omit == false, because if winnerOne is not true, it will enter ind the if statement 
    //will enter here if winnerOne is false 
}

Quelle

2016-03-29 16:58:14

Sie auch am Ende Ihrer if Prüfung, die ungültig haben eine übrig else ist. Sie müssen die letzte else if-Anweisung mit der }; beenden.

Möchten Sie den Text irgendwo ausgeben? Ich sehe keinen Code, der dies ist der Umgang mit - Sie können einige HTML hinzufügen, die wie so aktualisieren:

<div class="updatePoints"> 
    // leave empty 
</div>

Dann in Ihrem JavaScript können Sie immer einige Code fügen Sie den .updatePoints

var points = document.getElementByClass('updatePoints'); 
points.innerHTML = pointSum.value;

zu aktualisieren

Quelle

2016-03-29 17:20:52 jdave

Fügen Sie einige Zeilen in Ihrem Code hinzu und ändern Sie sie mit einigen Kommentaren. Kann versuchen bei https://jsfiddle.net/8fhwg6ou/. Hoffnung kann helfen.

<HTLML> 
<head> 
    <script> 
     var pointSum = 0; 
     var firstRound = 20; 
     var secondRound = 50; 
     var thirdRound = 100; 
     var fourthRound = 150; 
     var fifthRound = 250; 
     var finalRound = 300; 
     var winnerOne = false; 
     var winnerTwo = false; 
     var winnerThree = false; 
     var winnerFour = false; 
     var winnerFive = false; 
     var winnerSix = false; 

     function tally() { 
      var winner = document.getElementById("winner").value; 
      var firstWinner = "Ben"; 
      if (winner == firstWinner){ 
       winnerOne = true; // Use only one = symbol to assign value, not == 
       pointSum = Number(document.getElementById("points").value); // moved from outside and convert to number 

       // This code will update point in Points box 
       document.getElementById("points").value = tally_pointsum(pointSum); 

       // The codes below will add the text in div, just remove the + sign if you don't like 
       document.getElementById("updatePoints").innerHTML += (tally_pointsum(pointSum) - pointSum) + " points added<br />"; 
      } 
     } 

     // Wrap codes below become a function, lets call it tally_pointsum: 
     function tally_pointsum(pointSum) { 
      if (winnerOne == true){ 
       pointSum+=firstRound; 
      } else if (winnerTwo){ 
       pointSum+=secondRound; 
      } else if (winnerThree){ 
       pointSum+=thirdRound; 
      } else if (winnerFour){ 
       pointSum+=fourthRound; 
      } else if (winnerFive){ 
       pointSum+=fifthRound; 
      } else if (winnerSix){ 
       pointSum+=finalRound; 
      } 
      return pointSum; //return the sum to caller 
     } 
    </script> 
</head> 
<body> 
<form> 
    Winner: 
    <input type="text" name="winner" id="winner" size="20"> 
    Points: 
    <input type="text" name="points" id="points" size="20"> 
    Submit 
    <button type= "button" onclick="tally()">Tally points</button> 

</form> 
<!-- change class="updatePoints" to id="updatePoints" for document.getElementById("updatePoints") --> 
<div id="updatePoints"> 
</div>

Glücklich Codierung.

Quelle

2016-03-29 19:49:59

Basic Javascript onclick

Antwort

Verwandte Themen