Javascript帮助,随机化测验问题

时间:2016-04-08 16:39:42

标签: javascript html

我最近做了一些代码,但我想知道如何让测验选择6个中的3个问题而不是直接显示6个问题。帮助将不胜感激。我希望测验随机选择3个问题,然后如果重新加载有机会选择另外3个问题,总共6个问题。

<script language="JavaScript">


var numQues = 6;
var numChoi = 3;

var answers = new Array(6);
answers[0] = "16";
answers[1] = "8";
answers[2] = "The Walking Dead";
answers[3] = "Batman v Superman";
answers[4] = "Tupac";
answers[5] = "@ATAME2016";

function getScore(form) {
  var score = 0;
  var currElt;
  var currSelection;

  for (i=0; i<numQues; i++) {
    currElt = i*numChoi;
    for (j=0; j<numChoi; j++) {
      currSelection = form.elements[currElt + j];
      if (currSelection.checked) {
        if (currSelection.value == answers[i]) {
          score++;
          break;
        }
      }
    }
  }

  score = Math.round(score/numQues*100);
  form.percentage.value = score + "%";

  var correctAnswers = "";
  for (i=1; i<=numQues; i++) {
    correctAnswers += i + ". " + answers[i-1] + "\r\n";
  }
  form.solutions.value = correctAnswers;

}


</script>
</head>

<body>

<form name="quiz">
1. How many movie trailers are on the movie page?<br>
<input type="checkbox" name="question1" value="10">10<br>
<input type="checkbox" name="question1" value="14">14<br>
<input type="checkbox" name="question1" value="16">16<br>
<p>

2. How many pages are on this website?<br>
<input type="checkbox" name="q2" value="8">8<br>
<input type="checkbox" name="q2" value="6">6<br>
<input type="checkbox" name="q2" value="7">7<br>
<p>

3. What's the most popular show this week?<br>
<input type="checkbox" name="q3" value="The Walking Dead">The Walking Dead<br>
<input type="checkbox" name="q3" value="Mandem on the wall">Mandem on the wall<br>
<input type="checkbox" name="q3" value="Cotchin with Ksara">Cotchin with Ksara<br>
<p>

4. What movie has made the most money this week in the box office?<br>
<input type="checkbox" name="q4" value="Ride along 2">Ride along 2<br>
<input type="checkbox" name="q4" value="Batman v Superman">Batman v Superman<br>
<input type="checkbox" name="q4" value="GasMan">GasMan<br>
<p>

5. Which star in the celebrity page is no longer alive?<br>
<input type="checkbox" name="q5" value="Tupac">Tupac<br>
<input type="checkbox" name="q5" value="50 Cent">50 Cent<br>
<input type="checkbox" name="q5" value="Bradley cooper">Bradley cooper<br>
<p>

6. What is our twitter account name (@)?<br>
<input type="checkbox" name="q6" value="@ATAME">@ATAME<br>
<input type="checkbox" name="q6" value="@ATAME2016">@ATAME2016<br>
<input type="checkbox" name="q6" value="@A2THETAME">@A2THETAME<br>
<p>

<input type="button" value="Get score" onClick="getScore(this.form)">
<input type="reset" value="Clear"><p>
Score = <input type=text size=15 name="percentage"><br>
Correct answers:<br>
<textarea name="solutions" wrap="virtual" rows="4" cols="40"></textarea>
</form>




</div>

1 个答案:

答案 0 :(得分:0)

您想要使用Math.random()功能。请参阅:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random

常见的例子有:http://www.w3schools.com/jsref/jsref_random.asp

我尝试使用jQuery

尝试这样的事情
// Hides all questions on page load.
$('.questions').hide();

// Randomly shows 3 questions.
for (var i=0; i<3; i++) {
    var questionId = Math.floor((Math.random() * 6) + 1);
    $('#question-' + questionId).show();
}

然后将问题包装成<div><p>标签,如下所示:

<div id="question-1" class="questions">
    1. How many movie trailers are on the movie page?<br>
    <input type="checkbox" name="question1" value="10">10<br>
    <input type="checkbox" name="question1" value="14">14<br>
    <input type="checkbox" name="question1" value="16">16<br>
</div>

或者这个:

<p id="question-1" class="questions">
    1. How many movie trailers are on the movie page?<br>
    <input type="checkbox" name="question1" value="10">10<br>
    <input type="checkbox" name="question1" value="14">14<br>
    <input type="checkbox" name="question1" value="16">16<br>
</p>