jQuery：.text（）被延遲

Question

我正在學習jQuery動畫函數和wirting一個小遊戲，用戶必須在設定的時間範圍內點擊移動的div。該遊戲被寫入，以便當時間到了時，顯示最終得分，並且如果用戶點擊它，則用戶可以選擇「再次開始」。

問題是遊戲開始時顯示的計時器，時間是準確的，但顯示的時間是關閉的。

對於頁面加載一個例子母雞，計時器顯示即使壽它calleds第一叫$(document).ready()

經過調試我已確認這是$("#time-remaining").text((seconds -= 1) + " seconds");在setInterval()首先出現的最後一件事。

這裏是一個JSFiddle，顯示問題

除了在$("#time-remaining").text((seconds -= 1) + " seconds");是任何其他視覺顯示器之前先調用調試模式確認，我的想法，爲什麼定時器的顯示滯後一切的背後否則當其執行的第一件事

Answer 1

因爲你的間隔不會立即開始，它會延遲1000毫秒。

您可以在間隔之外更新一次文本。

... 
$("#time-remaining").text(seconds + " seconds"); 
// Countdown timer 
var timer = setInterval(function(){ 
    $("#time-remaining").text((seconds -= 1) + " seconds"); 
    if(seconds <= 0){ 
     clearInterval(timer); 
     GameOver(points); 
    } 
}, 1000); 
...