Javascript setInterval函数提高了onclick的速度

Question

我有一个脚本，它在点击时向下计数，它工作得很好，但问题是当按钮"运行"；被点击多次，计数器的速度就会增加。我使用了"；clearInterval"；删除最近创建的间隔，但它仍然不起作用。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<button class="run">Run</button>
<p class="show"></p>

编写脚本

$(".run").on("click", function() {
var myInterval;
var decrement=5;
clearInterval(myInterval) ;
myInterval=setInterval(function decrementNum() {
decrement--;
$(".decrement").text(decrement) ;
if(decrement==0){
decrement=5;
}
$(".show").text(decrement) ;
}, 2000)
})

Answer 1

您的intervalId是函数的本地值。每次添加越来越多的事件侦听器时。setInterval的频率正在增加，因此其speed increases将变量移到外部，以便每次click时，访问的myInterval都是相同的。

var myInterval;
$(".run").on("click", function() {
var decrement=5;
clearInterval(myInterval) ;
myInterval=setInterval(function decrementNum() {
decrement--;
$(".decrement").text(decrement) ;
if(decrement==0){
decrement=5;
}
$(".show").text(decrement) ;
}, 2000)
})