2016-03-20 7 views
-1

何らかの理由でスコア0だけ増分したいと考えています。 2つのfor-loopは同じですが(私が間違っていると本当に申し訳ありません)。したがって、totScoreはscore0変数から値を取得します。しかし、もちろん私はtotScoreが両方の変数から価値を得て、クイズの合計得点を得たいと思っています。クイズのスコアを取得しようとしています

また、score0 += 1;を書いたときにscore0変数に4を追加すると、それは私には何の意味もありません。

コードを変更する場合は、JQueryを使用しないでください。 ありがとう!あなたは適切な処理を取得されていません理由として

<!DOCTYPE html> 
<html> 
<body> 
<form id='quizForm'> 
    <ul> 
     <li> 
      <h3>How many letters are there in 'FB'?</h3> 
      <input type="radio" name="question0" value="A" />2<br> 
      <input type="radio" name="question0" value="B" />1<br> 
      <input type="radio" name="question0" value="C" />3<br> 
      <input type="radio" name="question0" value="D" />4<br> 
     </li> 
    </ul> 
    <ul> 
     <li> 
      <h3>How many letters are there in 'IBM'?</h3> 
      <input type="radio" name="question1" value="A" />2<br> 
      <input type="radio" name="question1" value="B" />1<br> 
      <input type="radio" name="question1" value="C" />3<br> 
      <input type="radio" name="question1" value="D" />4<br> 
     </li> 
    </ul> 
</form> 

<button onclick="showScore()">Show results 
</button> 
     <script>  
     //Score and answer variables 
     var score1 = 0; 
     var score0 = 0; 
     var totScore = 0; 
     var answers = ["A","C"] 
//function to calculate the score. 
function getScore() { 
    // some arrays and stuff 
    userInput1 = new Array(10); 
    userInput0 = new Array(10); 
    var question0s = document.getElementsByName("question0"); 

    //for loop to see which radio was checked 
    for (var i = 0; i < question0s.length; i++) { 
     if (question0s[i].checked) { 
      userInput0[0] = question0s[i].value; 
    } 
    if (userInput0[0] == answers[0]) { 
     // Only god knows why the hell I have to divide 4 
     score0 += 1/4; 
    } 
    else if (userInput0[0] != answers [0]){ 
     //so that user can't just switch back and fourth from inputs to get higher score. 
     score0 -= 1 ; 
    } 
    } 
    //if user has changed her answer multiple times she will get an answer with a negative value. I don't want that, so if score is less than 0 it turns to 0. 
    if (score0 < 0){ 
     score0 = score0 * 0; 
    } 

    var question1s = document.getElementsByName("question1"); 
    //for loop to see which radio was checked 
    for (var y = 0; y < question1s.length; y++) { 
     if (question1s[y].checked) { 
      userInput1[0] = question1[y].value; 
    } 
    if (userInput1[0] == answers[0]) { 
     score1 += 1; 
    } 
    else if (userInput1[0] != answers [0]){ 
    //so that user can't just switch back and fourth from inputs to get higher score. 
     score1 -= 1 ; 
    } 
    } 
    if (score1 < 0){ 
     //if user has changed her answer multiple times she will get an answer with a negative value. I don't want that, so if score is less than 0 it turns to 0. 
     score1 = score1 * 0; 
    } 
    //getting score from all different questions 
    totScore += score1 + score0; 
} 
//checking for changes in the form 
var quizForm = document.getElementById('quizForm'); 
quizForm.addEventListener("change", function(){ 
    getScore(); 
}); 


// onclick function 
function showScore(){ 
    alert (totScore); 
} 
    </script> 
</body> 
</html> 

答えて

0

、あなたはここで無効な変数question1を持っている:

userInput1[0] = question1[y].value; 

は、今度は、この問題を解決し、より良いを行うことができます。

まず、いくつかのグローバル変数があるので、単純な名前空間でそれを取得し、quizとしましょう。

マークアップからクリックハンドラを取り出し、そのリスナーを作成します。

ロジックについては、ラジオボタンをループしています。今すぐラジオボタンが機能する方法は、ただ1つしか選択できないので、ループをまったくやっていないという利点にそれを使ってみましょう。

ラジオボタンを使用してまだ選択されていない場合は、新しい選択手法を使用するとNULLになるので、両方の質問に回答したかどうかを確認することができます。そうでなければ、すべての質問が回答されるまで(スコアは0)、スコアは0になります(NULLではありません)。

//Score and answer variables= 
var quiz = { 
    score0: 0, 
    score1: 0, 
    totalScore: 0, 
    answers: ["A", "C"], 
    maxScore: 2, 
    tries: 0 
}; 
//function to calculate the score. 
function getScore() { 
    var answer0 = document.querySelector('input[name="question0"]:checked'); 
    quiz.score0 = answer0 != null && quiz.answers[0] == answer0.value ? 1 : 0; 
    var answer1 = document.querySelector('input[name="question1"]:checked'); 
    quiz.score1 = answer1 != null && quiz.answers[1] == answer1.value ? 1 : 0; 
    // if either is null, not all answered 
    if (answer0 != null && answer1 != null) { 
    // if previous tries, subtract how many 
    if (quiz.tries) { 
     quiz.totalScore = quiz.totalScore ? quiz.totalScore - quiz.tries : 0; 
     quiz.totalScore = quiz.totalScore < 0 ? 0 : quiz.totalScore ;//0 if negative 
    } else { 
     quiz.totalScore = quiz.score1 + quiz.score0; 
    } 
    quiz.tries++; 
    } 
} 
// onclick function 
function showScore() { 
    alert(quiz.totalScore + " in tries: " + quiz.tries); 
} 
// add listeners 
//checking for changes in the form 
var quizForm = document.getElementById('quizForm'); 
quizForm.addEventListener("change", function() { 
    getScore(); 
}); 
var resultButton = document.getElementById('results'); 
resultButton.addEventListener("click", function() { 
    showScore(); 
}); 

ここで上記を試してみてください:https://jsfiddle.net/MarkSchultheiss/qx4hLjLq/2/

をあなたはまた、このようなquizなものであることを置くことによってこれをより行うことができます:アクションで

//Score and answer variables= 
var quiz = { 
    totalScore: 0, 
    tries: 0, 
    maxScore: 2, 
    answered: 0, 
    questions: [{ 
    question: {}, 
    name: "question0", 
    score: 0, 
    answer: "A" 
    }, { 
    question: {}, 
    name: "question1", 
    score: 0, 
    answer: "C" 
    }], 
    checkQuestion: function(q) { 
    q.score = q.question != null && q.answer == q.question.value ? 1 : 0; 
    }, 
    //function to calculate the score. 
    getScore: function() { 
    this.answered = 0; 
    for (var i = 0; i < this.questions.length; i++) { 
     var sel = 'input[name="' + this.questions[i].name + '"]:checked'; 
     this.questions[i].question = document.querySelector(sel); 
     this.checkQuestion(this.questions[i]); 
     this.answered = this.questions[i].question ? this.answered + 1 : this.answered; 
    } 
    console.dir(this); 

    // if either is null, not all answered 
    if (this.answered == this.questions.length) { 
     for (var i = 0; i < this.questions.length; i++) { 
     this.totalScore = this.totalScore + this.questions[i].score; 
     } 
     if (this.tries) { 
     this.totalScore = this.tries && this.totalScore ? this.totalScore - this.tries : 0; 
     this.totalScore = this.totalScore < 0 ? 0 : this.totalScore; //0 if negative 
     } 
     this.tries++; 
    } 
    }, 

    // onclick function 
    showScore: function() { 
    var t = ""; 
    if (this.answered != this.questions.length) { 
     t = "Not all questions ansered!" 
    } else { 
     t = this.totalScore + " in tries: " + this.tries; 
    } 
    alert(t); 
    } 
}; 
// add listeners 
//checking for changes in the form 
var quizForm = document.getElementById('quizForm'); 
quizForm.addEventListener("change", function() { 
    quiz.getScore(); 
}); 
var resultButton = document.getElementById('results'); 
resultButton.addEventListener("click", function() { 
    quiz.showScore(); 
}); 

第二の例:https://jsfiddle.net/MarkSchultheiss/qx4hLjLq/4/

0

テスト結果を取得するだけの場合は、次のコードを使用してください。

<!DOCTYPE html> 
<html> 
<body> 
    <ul> 
     <li> 
      <h3>How many letters are there in 'FB'?</h3> 
      <input type="radio" name="question0"/>1<br> 
      <input type="radio" name="question0"/>2<br> 
      <input type="radio" name="question0"/>3<br> 
      <input type="radio" name="question0"/>4<br> 
     </li> 
    </ul> 
    <ul> 
     <li> 
      <h3>How many letters are there in 'IBM'?</h3> 
      <input type="radio" name="question1"/>1<br> 
      <input type="radio" name="question1"/>2<br> 
      <input type="radio" name="question1"/>3<br> 
      <input type="radio" name="question1"/>4<br> 
     </li> 
    </ul> 
<button onclick="calculate()">Submit</button> 
<script> 
function calculate(){ 
    var answers = [1, 2]; 
    var score = 0; 
    var question0s = document.getElementsByName("question0"); 
    var question1s = document.getElementsByName("question1"); 
    if (question0s[answers[0]].checked == true) { 
     score++; 
    } 
    if (question1s[answers[1]].checked == true) { 
     score++; 
    } 
    alert ("You got " + score + " out of " + answers.length + "."); 
} 
</script> 
</body> 
</html> 

答えが変わるたびにスクリプトを呼び出しているようですが、これは非常に非効率的です。私はすべての答えがなされ、ユーザーがsubmitを押すときにだけ電話をしています。

そして、それが4回追加される理由は、最初の回答をAに設定するとuserinput0に書き込まれ、回答が唯一チェックされているのでそれ以上変更されず、あなたが4を追加しているので、あなたはその割り当てステートメントを4回繰り返すことになります。

+0

ああ、そのコードは私の笑よりもはるかに優れています。ありがとう、本当に役に立つ! –

+0

私の回答があなたの質問にすべて答えるならば、大きな投票番号の下にあるチェックマークをチェックしてください。それは私を助け、この質問に答えたものとしてマークしています。 – Bradman175

関連する問題