单击id为next-problem的按钮时,将向服务器发送AJAX请求,并加载新任务。我想在加载新任务时重新启动计时器。在AJAX中,如果成功,我想重置计时器。但问题是许多setInterval get都是在单击按钮时启动的。如何避免这种情况?
var timer;
var countdownfunction;
var countDownTime;
timer = function (){
clearInterval(countdownfunction);
countDownTime = $("#timer").attr("data-timer-val");
var countdownfunction = setInterval(function() {
if(countDownTime < 10 ){
var temp = "0" + countDownTime;
$("#time").text(temp);
}else{
$("#time").text(countDownTime);
}
countDownTime = countDownTime - 1;
if (countDownTime < 0) {
clearInterval(countdownfunction);
$("#time-expired").text("Please click next problem.");
}
}, 1000);
} ;
$(document).ready(function(){
timer();
});
$(document).ready(function(){
$("#next-problem").on('click', function(){
$.ajax({
type : 'POST',
url : '/test/next-problem/',
success : function(data){
// console.log(data);
$("#problem-content").html(data);
clearInterval(countdownfunction);
timer();
},
});
});
});
发布于 2018-08-27 03:41:54
从以下行中删除var
:
var countdownfunction = setInterval(function() {
由于这个var
,您有两个不同作用域的countdownfunction
值,因此当您调用clearInterval
时,在该计时器到达-1
之前,您永远不会清除这个特定的函数作用域的值,因此您可能会有多个计时器在彼此之上运行。
在这里删除var
之后,现在就有了一个全局作用域的变量,可以清除该变量并重新赋值。
https://stackoverflow.com/questions/52029057
复制相似问题