如何为每个问题创建测验倒数计时器

Question

我想为测验创建一个倒数计时器，该测验将在下一个问题上重置，如果时间用完并且玩家尚未选择答案，也可以转到下一个问题。任何人都可以帮我创建这个吗？var counter = 10;setInterval(function () {  counter--;  if (counter >= 0) {    id = document.getElementById('count');    id.innerHTML = counter;  }  if (counter === 0) {    id.innerHTML = 'Times Up!';  }}, 1000);'''

Answer 1

这是适合您的基本工作代码。玩一玩它以获得您想要的结果。祝您编码愉快！

var counter = 10;             //Time counter

var questionsCount = 0;       //Questions counter

//Questions array

var questions = [

   "Question 1","Question 2","Question 3"

] 

questionDivId =  document.getElementById('question');

setInterval(function () {

    counter--;

    if (counter >= 0) {

        id = document.getElementById('count');

        id.innerHTML = counter;

    }

    if (counter === 0) {

        id.innerHTML = 'Times Up!';

        counter = 10;

        questionsCount++;

    } 

    

    //To check if all questions are completed or not

    if (questionsCount === questions.length){

        questionDivId.innerHTML = "Well Played! Game is over";

        id.innerHTML = "";

    } else{

        questionDivId.innerHTML = questions[questionsCount];

    }   

}, 1000);

//To go to the next question

function goToNextQuestion() {

    questionsCount++;

    counter = 10;

}

<div>

    <h1 id="question"></h1>

    <h1 id="count"></h1>

    <button onclick="goToNextQuestion()">Next</button>

</div>