0
votes

Comment ajouter deux chiffres et afficher un résultat dans la rubrique JavaScript

Je dois prendre deux chiffres de l'entrée de l'utilisateur et les ajouter, puis l'afficher dans un titre similaire "Le total est ()" et une autre fonction pour afficher la moyenne d'entre elles. J'ai essayé ce code mais quand je clique sur le bouton, rien n'arrive et aucun résultat ne me montre. Pouvez-vous s'il vous plaît aidez-moi à vous aider à figurer l'erreur

p>

<html>

<head>
  <meta charset="utf-8">
  <title>Quiz Grade Calculator</title>
</head>

<body>
  <h2>Quiz Grade Calculator</h2>
  <div style="width:45%;">
    <img id="myimg" src="check.png" style="float:right; visibility:hidden;">
    <div>QUIZ1 <input type="text" size="2" id="quiz1" value="0" onchange="Add()" /> / 5</div>
    <div>QUIZ2 <input type="text" size="2" id="quiz2" value="0" onchange="Add()" /> / 5</div>
  </div>
  <h3>Student Total: <span id="sTotal">0</span></h3>
  <input type="button" id="computeAvg" value="Add Quiz" onclick="Add()"> CLASS AVERAGE <input type="text" size="5" id="cAvg" />
</body>

</html>


4 commentaires

Vérifiez la console de votre navigateur. Il y aura une erreur de syntaxe.


Placez votre script après la balise du corps, votre étiquette de script ne peut pas voir les nœuds DOM quand il est exécuté


@Sumédhchakravorte d'où la fenêtre .onload = départ;


J'ai vérifié qu'il n'y a pas d'erreur de syntaxe et j'ai essayé de mettre le script après le corps et que rien ne change, aucune action ne se passe


3 Réponses :


0
votes

Il y a un nombre d'erreurs, les principaux sont:

  • en fonction Ajouter code> Vous devez utiliser document.getElementByID ("stottal"). innerhtml = c; code> code> code> en raison de span code> n'a pas valeur code>. p> li>

  • un Ajouter () code> et Ajouter () code> Noms différents, tandis que Ajouter code> est défini Ajouter code> n'est pas. p> li>

  • dans document.getElementByID ("myimg"). Onclick = avg () { code>, vous oubliez fonction code>, qui cause une erreur de syntaxe. P > li> ul>

    p>

    <h2>Quiz Grade Calculator</h2>
    <div style="width:45%;">
      <img id="myimg" src="check.png" style="float:right; visibility:hidden;">
      <div>QUIZ1 <input type="text" size="2" id="quiz1" value="0" onchange="add()" /> / 5</div>
      <div>QUIZ2 <input type="text" size="2" id="quiz2" value="0" onchange="add()" /> / 5</div>
    </div>
    <h3>Student Total: <span id="sTotal">0</span></h3>
    <input type="button" id="computeAvg" value="Add Quiz" onclick="add()"> CLASS AVERAGE <input type="text" size="5" id="cAvg" />


0 commentaires

0
votes


0 commentaires

0
votes
<html>
<head>
    <meta charset = "utf-8">
    <title>Quiz Grade Calculator</title> 

    <script type="text/javascript">

        var count =0;

    function start()
        {
            //var q1 = document.getElementById("quiz1");
            //q1.addEventListener("click",Add,false);
           // var q2 = document.getElementById("quiz2");
            // q2.addEventListener("click",Add,false);
            var i = document.getElementById("computeAvg");
            i.addEventListener("click", add, false);
            }


       function add() {
            var a = document.getElementById("quiz1").value;
            var b = document.getElementById("quiz2").value;
            var c = parseInt(a) + parseInt(b);
            document.getElementById("sTotal").innerHTML = c;
            Avg();
        }


         function Avg()
        {  
            // since the number of count is predifine
             count = 2;
             document.getElementById("cAvg").value = (parseInt(document.getElementById("quiz1").value) + parseInt(document.getElementById("quiz2").value)) / count;
             document.getElementById("myimg").onclick = Avg();
             document.getElementById("myimg").style.visibility = "visible";

         }

    window.onload=start;
    </script>
</head>
<body>
    <h2>Quiz Grade Calculator</h2>
    <div style="width:45%;">
        <img id="myimg" src="check.png" style="float:right; visibility:hidden;">  
        <div>QUIZ1 <input type="text" size="2" id="quiz1" value="0" onchange="Add()"/> / 5</div>
        <div>QUIZ2 <input type="text" size="2" id="quiz2" value="0" onchange="Add()"/> / 5</div>
    </div>
    <h3>Student Total: <span id="sTotal">0</span></h3>
    <input type = "button" id="computeAvg" value = "Add Quiz" onclick="Add()">
    CLASS AVERAGE <input type="text" size="5" id="cAvg"/> 
</body>

0 commentaires