如何首次避免延迟启动js setInterval()函数

Question

您能否看一下下面的代码,让我知道如何才能避免这次倒计时过程中的第一次延迟？

你可以看到计数器工作正常,但第一次启动有一个延迟.

var sec = 20;
var timer = setInterval(function() { 
   $('#box').text(sec--);
   if (sec == -1) {
      $('#box').css('color','blue');
      clearInterval(timer);
   } 
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="box">20</div>

Answer 1

使用--sec而不是sec--,以便设置更改的值.

这个有用的原因在这里有很好的描述:++ someVariable Vs. Javascript中的someVariable ++

所以你的代码应该是这样的:

var sec = 20;
var timer = setInterval(function() { 
   $('#box').text(--sec);
   if (sec == -1) {
      $('#box').css('color','blue');
      clearInterval(timer);
   } 
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="box">20</div>