2013-07-16 75 views
0

我正在用秒,分鐘和小時製作秒錶。我希望秒錶重置並在小時達到59後重新啓動。另外,當分鐘達到59時,我希望時針增加。它似乎沒有工作。如果你願意,左邊的小時「手」不會增加。即使當我說明我希望它。小時不在秒錶

請注意SPETI「5」在SETTIMEOUT上。我花了很長時間來測試時間。應該是「1000」。

HTML:

<ul> 

     <li id="hour-greater">0</li> 
     <li id="hour-lesser">0</li> 
     <li>:</li> 
     <li id="min-greater">0</li> 
     <li id="min-lesser">0</li> 
     <li>:</li> 
     <li id="sec-greater">0</li> 
     <li id="sec-lesser">0</li> 

    </ul> 

JS:

(function() { 

    var secLesser = document.getElementById("sec-lesser").value, 
    secGreater = document.getElementById("sec-greater").value, 
    minLesser = document.getElementById("min-lesser").value, 
    minGreater = document.getElementById("min-greater").value, 
    hourLesser = document.getElementById("hour-lesser").value, 
    hourGreater = document.getElementById("hour-greater").value; 


    function stopWatch(){ 
     secLesser++; 
     if(secLesser > 9) { 
      secLesser = 0; 
      secGreater++; 
     } else if(secGreater + secLesser == 14){ 
      secGreater = 0; 
      secLesser = 0; 
      minLesser++; 
     } else if(minLesser > 9){ 
      minLesser = 0; 
      minGreater++; 
     } else if(minGreater + minLesser == 14){ 
      secGreater = 0; 
      secLesser = 0; 
      hourLesser++; 
     } else if(hourLesser > 9){ 
      hourLesser = 0; 
      hourGreater++; 
     } else if(hourGreater + hourLesser == 14){ 
      alert("It's been 59 hours... leave this page!"); 
     } 

     document.getElementById("sec-lesser").textContent = secLesser; 
     document.getElementById("sec-greater").textContent = secGreater; 
     document.getElementById("min-lesser").textContent = minLesser; 
     document.getElementById("min-greater").textContent = minGreater; 
     document.getElementById("hour-lesser").textContent = hourLesser; 
     document.getElementById("hour-greater").textContent = hourGreater; 
     window.setTimeout(stopWatch, 5); 
    } 

    stopWatch(); 
})(); 
+1

恩,這不是一個很好的方法來編碼秒錶,因爲setTimeout是不準確的,並且當頁面/標籤被最小化/隱藏時會做其他奇怪的事情。 – epascarello

+0

我明白這一點。我也注意到了它。我將使用setInterval ..只是想知道爲什麼小時不工作;;) – Matthew

+2

setInterval是沒有更好的! – epascarello

回答

1

,你必須

} else if(minGreater + minLesser == 14){ 
      secGreater = 0; 
      secLesser = 0; 
      hourLesser++; 

應重置部分ting minGreater和minLesser不是secGreater/secLesser。將其更改爲:

} else if(minGreater + minLesser == 14){ 
      minGreater = 0; 
      minLesser = 0; 
      hourLesser++; 

哦,看看requestAnimationFrame來的setTimeout/setInterval的更好的選擇。

相關問題