Question

我想做一个简单的测验，检查正确的答案并计算页面底部输出的分数。我能用简单的js和html做到这一点但是想用jquery做同样的事情。但是当我在jquery版本中按提交时没有任何反应（我是jquery的菜鸟，无法找到错误的内容）在此先感谢！

//Question One Answer is 'a'
//Question One Answer is 'b'
//Question One Answer is 'b'
//Question One Answer is 'b'
//Question One Answer is 'a'

var score = 0;

checkAll = function() {

  var message;
  // var score = 0; 

  if ($("#question1").val() === "a") {
    score++;
  } else {
    return false;
  }

  if ($("#question2").val() === "b") {
    score++;
  } else {
    return false;
  }

  if ($("#question3").val() === "b") {
    score++;
  } else {
    return false;
  }

  if ($("#question4").val() === "b") {
    score++;
  } else {
    return false;
  }

  if ($("#question5").val() === "a") {
    score++;
  } else {
    return false;
  }

  message = "You got " + score + "out of five questions right!";
  $("#results").html(message);

  initialize = function() {
    $("#init").click(checkAll)
  };
};

<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Form Example</title>

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js">
  </script>

  <script type="text/javascript" src="quiz.js"></script>

</head>

<body>

  <h1>Geography Quiz</h1>


  <p>
    <label for="user">Name:</label>
    <input type="text" name="username" id="user" />
  </p>
  <div class="qheader">
    <p> 1) Which of the countries below is largest by area?</p>
  </div>
  <div class="questsel">
    <input type="radio" value="a" name="question1">a) Russia<br>
    <input type="radio" value="b" name="question1">b) China<br>
    <input type="radio" value="c" name="question1">c) USA<br>
    <input type="radio" value="d" name="question1">d) Canada<br>
  </div>

  <br>

  <div class="qheader">
    <p> 2) Which of these cities is United States Capital?</p>
  </div>
  <div class="questsel">
    <input type="radio" value="a" name="question2">a) New York<br>
    <input type="radio" value="b" name="question2">b) Washington D.C
    <input type="radio" value="c" name="question2">c) Chicago<br>
    <input type="radio" value="d" name="question2">d) Moscow<br>
  </div>

  <div class="qheader">
    <p> 3) Which of these cities is Spain's Capital?</p>
  </div>
  <div class="questsel">
    <input type="radio" value="a" name="question3">a) Barcelona<br>
    <input type="radio" value="b" name="question3">b) Madrid <br>
    <input type="radio" value="c" name="question3">c) Milan<br>
    <input type="radio" value="d" name="question3">d) Rome<br>
  </div>

  <div class="qheader">
    <p> 4) Which ocean is the largest?</p>
  </div>
  <div class="questsel">
    <input type="radio" value="a" name="question4">a) Arctic<br>
    <input type="radio" value="b" name="question4">b) Pacific<br>
    <input type="radio" value="c" name="question4">c) Indian<br>
    <input type="radio" value="d" name="question4">d) Atlantic<br>
  </div>

  <div class="qheader">
    <p> 5) Which of these rivers is largest in North America?</p>
  </div>
  <div class="questsel">
    <input type="radio" value="a" name="question5">a) Missouri River<br>
    <input type="radio" value="b" name="question5">b) Nile River <br>
    <input type="radio" value="c" name="question5">c) Amazon River<br>
    <input type="radio" value="d" name="question5">d) Yenisei River<br>
  </div>

  <p>
    <input type="button" id="init" value="Submit" />
  </p>

  <p id="results"></p>

  </form>

</body>

</html>

使用jquery问题

0 个答案: