Question

所以我做了这个小而短的幼稚测验，只是为了练习javascript技能，因为我是新手。这是代码：

    <! DOCTYPE>
<html>
<head>
<title>Interactive quiz</title>
</head>

<body>

<input type="button" value="Start the quiz" name="quiz" onclick="durationOfQuiz();">


<script>
var questions = ["How many times did 50 cent get shot? a)9 b)4 c)3", 
"What year did Micheal Jackson die? a)2009 b) 2012 c) 2010",
"How many awards has Drake recieved as of January 2015? a)34 b)36 c) 20",
"What year did Kanye West win his first award? a) 2004 b) 2005 c )2003",
"How old is 50 cent? a)45 b)38 c )39",
"What year did the beatles break up? a)1987 b)1970 c)1966",
"How many sons does 50 cent have? a)4 b)3 c)2",
"When did 2Pac die? a)1996 b)1990 c)1991",
"When did biggie smalls die? a)1997 b)1980 d) 1990",
"when did eazy e die? a)1995 b)1996 c) 1989"];

var userAnswers = [];
var pointCounter = 0;

function durationOfQuiz(){
//TIMER GOES HERE
//gettingAnswers();
setTimeout(gettingAnswers,0);
//ENDING TIMER
}

function gettingAnswers (){

for(var i = 0; i < questions.length; i++){
var answers = prompt(questions[i]);
userAnswers[i] = answers;
}

if(userAnswers[0] == "9"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[0] == "a"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[0] + " You typed in " +userAnswers[0] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[1] == "2012"){document.write("<p>" + questions[1] + " You typed in " +userAnswers[1] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[1] == "a"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[1] + " You typed in " +userAnswers[1] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[2] == "36"){document.write("<p>" + questions[2] + " You typed in " +userAnswers[2] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[2] == "b"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[2] + " You typed in " +userAnswers[2] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[3] == "2004"){document.write("<p>" + questions[3] + " You typed in " +userAnswers[3] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[3] == "a"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[3] + " You typed in " +userAnswers[3] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[4] == "39"){document.write("<p>" + questions[4] + " You typed in " +userAnswers[4] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[4] == "c"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[4] + " You typed in " +userAnswers[4] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[5] == "1970"){document.write("<p>" + questions[5] + " You typed in " +userAnswers[5] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[5] == "b"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[5] + " You typed in " +userAnswers[5] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[6] == "2"){document.write("<p>" + questions[6] + " You typed in " +userAnswers[6] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[6] == "c"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[6] + " You typed in " +userAnswers[6] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[7] == "1996"){document.write("<p>" + questions[7] + " You typed in " +userAnswers[7] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[7] == "a"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[7] + " You typed in " +userAnswers[7] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[8] == "1997"){document.write("<p>" + questions[8] + " You typed in " +userAnswers[8] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[8] == "a"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[8] + " You typed in " +userAnswers[8] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

if(userAnswers[9] == "1995"){document.write("<p>" + questions[9] + " You typed in " +userAnswers[9] + ". Correct! +2 points! " + "</p>"); pointCounter = pointCounter + 2;
}else if(userAnswers[9] == "a"){document.write("<p><span class = 'correct'>" + questions[0] + " You typed in " +userAnswers[0] + ". Correct! +2 points! " + "</span></p>");pointCounter = pointCounter + 2;}
else{document.write("<p>" + questions[9] + " You typed in " +userAnswers[9] + ". Incorrect! -1 points! " + "</p>"); pointCounter = pointCounter - 1;}

document.write("Total point = " + pointCounter);

if(pointCounter<5){
document.body.style.backgroundColor="grey";
}else if(pointCounter > 6 && pointCounter <10){
document.body.style.backgroundColor="pink";
}else if(pointCounter > 11){
document.body.style.backgroundColor="blue";
}


}

</script>
</body>
</html>

所以它非常基本，但我想实现一个功能，用户有2分钟回答问题，否则测验结束。我在想我应该使用setTimeOut函数，我在参数中传递'gettingAnswers'函数并将其设置为0 ms，因此它会立即执行，因为我不想要任何延迟但是我不知道如何完成执行如果2分钟过去了，则getAnswers函数......我在考虑clearTimeOut（）吗？

Answer 1

clearTimeout(timer)允许取消尚未执行的功能调用，timer是之前调用setTimeout的结果，即var timer = setTimeout(gettingAnswers, 0);。所以这不是你的情况。

你应该实现一个函数finishQuiz();，你可以使用setTimeout来调用gettingAnswers，并且应该毫不拖延地调用gettingAnswers();//executed immediately and builds the questions on page setTimeout(finishQuiz, 2 * 60 * 1000);//executed in 2 minutes and stops quiz：

finishQuiz

{{1}}应该计算分数，显示分数并隐藏问题。当用户花时间回答你时，你不应该在我的视野中执行任何功能。

你的问题更多的是算法而不是编程技术。更好的网站是Code Review StackExchange

如何使用javascript结束通过计时器执行的功能？

1 个答案: