javascript setInterval未按時運行

Question

我寫了一個無法正常工作的計時器方法。 它應該顯示在表單上經過的時間，但它按2或3計數而不是每秒計數一次。 什么可能導致這種行為，我該如何解決？

我的代碼：

 function startTimer() { var minutes, seconds; setInterval(function () { if (!isPaused) { minutes = parseInt(timer / 60, 10); seconds = parseInt(timer % 60, 10); minutes = minutes < 10 ? "0" + minutes : minutes; seconds = seconds < 10 ? "0" + seconds : seconds; $('#TimeLabel').text("Form Time: " + minutes + ":" + seconds); ++timer; } }, 1000); } 

上面的代碼顯示“表格時間：00：01”，然后是“表格時間：00：04”，然后是“表格時間：00：07”等。

Answer 1

這是我想出的一個例子。 它使用時間，以便不依賴於setInterval的准確性。 希望這可以幫助！

function startTimer(){
        var minutes,
            seconds;

        var startTime = new Date;

        setInterval(function(){

            var currentTime = new Date;
            seconds = currentTime.getSeconds() - startTime.getSeconds();

            if(seconds < 0){
                seconds += 60;
            }else if(seconds === 0){
                minutes = currentTime.getMinutes() - startTime.getMinutes();
            }

            console.log(minutes + ':' + seconds);

        }, 100);
}
startTimer();

Answer 2

它取決於javascript的異步性質以及它在單個線程上運行的事實。

網上有很多文章解釋了事件循環是如何工作的，因此，我認為沒有必要在這里解釋它。

您只需要記住： setTimeout或setInterval或其他類似指令將在作為參數傳遞的delay time之后的第一個可用時間執行。

所以， window.setTimeout(function() { console.log('Hello World'); }, 1000); 並不意味着將在1000ms（1s）之后完全執行。

它基本上意味着等待100ms，當事件循環是空閑時，調用作為參數傳遞的回調。

進一步閱讀

Answer 3

我剛剛在控制台中使用了代碼，發現它工作正常，代碼是：

  var timer =1;
  var minutes, seconds;

  setInterval(function () {

  minutes = parseInt(timer / 60, 10);
  seconds = parseInt(timer % 60, 10);

  minutes = minutes < 10 ? "0" + minutes : minutes;
  seconds = seconds < 10 ? "0" + seconds : seconds;

  console.log("Form Time: " + minutes + ":" + seconds);

  ++timer;
  }, 1000);

因此可能會有一些東西會增加計時器的值或確保你的函數startTimer只調用一次。

Answer 4

問題可能與不聲明所有變量有關。 當我在控制台中運行此版本時，它正常工作：

 function startTimer() { var minutes, seconds, isPaused = false, timer = 1; setInterval(function () { if (!isPaused) { minutes = parseInt(timer / 60, 10); seconds = parseInt(timer % 60, 10); minutes = minutes < 10 ? "0" + minutes : minutes; seconds = seconds < 10 ? "0" + seconds : seconds; console.log("Form Time: " + minutes + ":" + seconds); timer++; } }, 1000); } startTimer();