我正在使用 setInterval() 运行 JavaScript 计时器。我想运行计时器 5 秒，然后从零秒重新启动计时器，并且相同的进程应该运行 3 次。
<!DOCTYPE html>
<html>
<head>
<title>Jquery setinterval stop after sometime</title>
</head>
<body>
<p>Counter: <span id="counter"></span></p>
<p>Seconds: <span id="seconds"></span></p>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var start_secs;
var counter = 0;
function intervalFunc(){
var seconds = 0;
$('#counter').html(counter);
start_secs = setInterval(function(){
$('#seconds').html(seconds);
if(seconds===5){
if(counter < 3){
intervalFunc();
}else{
console.log('else');
clearInterval(start_secs);
seconds=0;
return false;
}
}
seconds++;
}, 1000);
counter++;
}
intervalFunc();
});
</script>
</body>
上面的代码计时器工作正常，直到 counter 值小于 3，但之后 setInterval() 继续运行，即使使用clearInterval()也不会停止。
任何人都可以指出给定代码中的问题，即为什么 setInterval() 在 counter 值大于或等于 3 后没有停止？
最佳答案
有一些问题。主要的是start_seconds需要位于函数本地，而不是在函数外部声明 - 您希望在函数内独立控制每个间隔。按照您的方式，您会丢失对早期计时器的引用。并且您想清除seconds == 5时的间隔无论是否counter < 3因为你正在开始一个新的。
类似这样的事情:
var counter = 0;
function intervalFunc(){
var seconds = 0
var start_secs = setInterval(function(){
console.log(seconds)
if(seconds===5){
if(counter < 3){
intervalFunc();
}
// after 5 times clear the interval
// a new one is started if counter < 3
clearInterval(start_secs);
return
}
seconds++;
}, 500);
counter++;
}
intervalFunc();关于JavaScript setInterval 没有停止，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53138307/