2

スペイン語のクラスのクイズを作成しようとしています。JavaScriptの経験はほとんどありませんが、htmlとCSSにはかなり精通しています。質問があり、続いて3つのラジオボタンと回答があります。2つの間違った答えと正しい答えがあります。全部で45の質問があります。

<form name="quiz" method="post" name="buttons" id="form" onsubmit="return totalVal()">

<li><div class="question">¿Quién detestan la nueva casa?</div></li>
<input id="answer" type="radio" name="group1" value="wrong"> Josh<br>
<input id="answer" type="radio" name="group1" value="wrong"> Amanda<br>
<input id="answer" type="radio" name="group1" value="correct"> Josh y Amanda<hr>

<li><div class="question">¿Quién es señor Dawes?</div></li>
<input id="answer" type="radio" name="group2" value="wrong">Un familia amigo<br>
<input id="answer" type="radio" name="group2" value="wrong">Un gato<br>
<input id="answer" type="radio" name="group2" value="correct">Un amable joven de la agencia de bienes raíces<hr>

<li><div class="question">¿Quién qué sus buscan?</div></li>
<input id="answer" type="radio" name="group3" value="wrong">Josh<br>
<input id="answer" type="radio" name="group3" value="wrong"> Petey<br>
<input id="answer" type="radio" name="group3" value="correct" >Josh y Petey<hr>

<button class="submit" onclick="showTotalvalue();" type="submit">Submit</button></div>

基本的なJavascriptを使用して、すべての「正しい」ラジオボタンの値をカウントし、ユーザーが[送信]をクリックした後に表示される新しいページまたはアラートボックスに出力したいと思います。

私はこれを私の研究で見つけました。グーグルで、「正しい」値をカウントするコードのスニペットを見つけることができませんでした。上記のリンクは私が得た最も近いものです。他の投稿の提案から状況に合わせて変更したJavaScriptを添付しました。

totalVal = 0;

// calculate the total number of corrects clicked

for (y = 0; y = incorrectOfQuestion; y++) {
    var questionNo = document.getElementsByName("questions" + y);
    for (i = 0; i < questionNo.length; i++) {
        if (document.myform.questions[i].checked == true) {
            totalVal = totalVal + parseInt(document.myform.questions[i].value, 45);
        }
    }
}

私は時間の危機に瀕しているので、どんな援助も大歓迎です！ありがとうございました！

4

2 に答える 2

2

これは、アラート ボックスで動作させるために必要なコードです。

        function handleClick()
          {         
        var amountCorrect = 0;          
        for(var i = 1; i <= 45; i++) {
          var radios = document.getElementsByName('group'+i);
          for(var j = 0; j < radios.length; j++) {
            var radio = radios[j];
            if(radio.value == "correct" && radio.checked) {
              amountCorrect++;
            }
          }
         }                   
            alert("Correct Responses: " + amountCorrect);
          }
        <form name="quiz" method="post" name="buttons" id="quiz" onsubmit="return false">

        <li><div class="question">¿Quién detestan la nueva casa?</div></li>
        <input id="answer" type="radio" name="group1" value="wrong"> Josh<br>
        <input id="answer" type="radio" name="group1" value="wrong"> Amanda<br>
        <input id="answer" type="radio" name="group1" value="correct"> Josh y Amanda<hr>

        <li><div class="question">¿Quién es señor Dawes?</div></li>
        <input id="answer" type="radio" name="group2" value="wrong">Un familia amigo<br>
        <input id="answer" type="radio" name="group2" value="wrong">Un gato<br>
        <input id="answer" type="radio" name="group2" value="correct">Un amable joven de la agencia de bienes raíces<hr>

        <li><div class="question">¿Quién qué sus buscan?</div></li>
        <input id="answer" type="radio" name="group3" value="wrong">Josh<br>
        <input id="answer" type="radio" name="group3" value="wrong"> Petey<br>
        <input id="answer" type="radio" name="group3" value="correct" >Josh y Petey<hr>

        <button class="submit" onclick="return handleClick();" type="submit">Submit</button>
        
        </form>

@pimvdb は、型変換を許可しない「正しい」文字列をチェックするときに === 演算子を使用していたため、失敗していました。彼は getElementsByClassName も使用しましたが、要素にはクラスが適用されていないため、これは誤りでした。

作業バージョンは、以下のフィドルにあります。ご覧のとおり、フォームの onsubmit は「return false」に設定されており、フォームの投稿を停止しています。

http://jsfiddle.net/g45nG/1/

于 2012-12-18T16:37:40.473 に答える
2

各ラジオグループをループしてから、各ラジオボタンをループして、正しいものがチェックされているかどうかを確認できます。

var amountCorrect = 0;
for(var i = 1; i <= 45; i++) {
  var radios = document.getElementsByName("group" + i);
  for(var j = 0; j < radios.length; j++) {
    var radio = radios[j];
    if(radio.value === "correct" && radio.checked) {
      amountCorrect++;
    }
  }
}
于 2012-12-18T15:19:49.443 に答える