为什么我不能得分加分和显示?

时间:2015-10-08 17:16:19

标签: javascript jquery

我一直在研究这个问题,但我无法得到它。我正在尝试添加正确的答案并在最后显示它们。有人可以查看我的代码,请让我知道最好的方法吗?



import matplotlib.pyplot as plt

x = [1,2,3,4,5]
y = [10,40,30,10,3]

plt.bar(x,y)

plt.show()

$(document).ready(function() {
  var counter = 0;
  var score = 0;


  var quizQuestions = [{
    question: "In what year was America founded ?",
    choices: ["1775", "1776", "1801", "1492"],
    answer: 1
  }, {
    question: "Who did not sign the Declaration of Independence ?",
    choices: ["George Wasington", "Ben Franklin", "John Hancock", "Thomas Jefferson"],
    answer: 0
  }, {
    question: "Who was the only president to serve more than two terms?",
    choices: ["George Washington", "Woodrow Wilson", "Franklin Delano Roosevelt", "James Madison"],
    answer: 2
  }, {
    question: "In what year did America land on the moon ?",
    choices: ["1969", "1965", "1970", "1968"],
    answer: 0
  }, {
    question: "Which country did America buy the Louisiana Purchase from ?",
    choices: ["England", "Spain", "Germany", "France"],
    answer: 3
  }]

  $("#start").click(function() {
    $("#start").hide()
    $("#next").show()
  });

  $("#next").on("click", function() {

    $(".choices, .questions").empty();

    function incrementCounter() {
      $("#count").text(counter);
    };

    $(".questions").append("<h2>" + quizQuestions[counter].question + "</h2>")

    for (var i = 0; i < quizQuestions[counter].choices.length; i += 1) {
      $(".choices").append("<ul>" + "<input type='radio' name='radio'/>" + quizQuestions[counter].choices[i] + "</ul>")
    }

    incrementCounter();
    counter++

  });

  $("body").on("click", "input", function() {

    $("input[type='radio']:checked").val();

    var $selectedText = $("input[type='radio']:checked").val();

    if ($selectedText === quizQuestions[counter].answer) {
      score += 1;
    }

    if (counter === quizQuestions.length) {

    }

  })

});
&#13;
body {
  background-image: url("../img/american-flag.jpg");
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
html,
body {
  min-height: 100%;
}
.quiz-app {
  position: relative;
  width: 400px;
  height: 400px;
  background-color: white;
  border-style: solid;
  margin: 0 auto;
  top: 200px;
  text-align: center;
}
h1 {
  color: orange;
}
#start {
  margin-top: 70px;
  width: 70px;
  border-radius: 5px;
  bottom: 150px;
}
#next {
  display: none;
  margin-top: 70px;
  width: 70px;
  border-radius: 5px;
  bottom: 150px;
}
.questions {
  text-align: center;
  margin-left: 25px;
  margin: 0 auto;
  bottom: 120px;
  color: red;
}
.choices {
  display: block;
  bottom: 100px;
}
#count {
  width: 50px;
  height: 20px;
  text-align: bottom;
}
#score {
  display: inline-block;
  text-align: right;
  left: 100px;
  width: 70px;
}
&#13;
&#13;
&#13;

我面临的问题是我想在测验结束时显示分数。我希望它例如说:&#34; 1 of 5 correct&#34;或那些影响的东西。

2 个答案:

答案 0 :(得分:0)

您的无线电输入没有分配给它们的值。通过分配值,您的代码应按预期工作:

$(".choices").append("<ul>" + "<input type='radio' name='radio' value='" + i + "' />" + quizQuestions[counter].choices[i] + "</ul>");

答案 1 :(得分:0)

两件事:

  1. 正如David所说,您的单选按钮没有value来检查。
  2. 检查是否给出了正确答案是不正确的。 $selectedText将是一个字符串,而问题.answer是一个整数(它是核心答案索引,但是单选按钮不是很有用)。