2013-07-16 5 views
0

초, 분, 시간으로 스톱워치를 만들고 있습니다. 스톱워치를 재설정하고 시간이 59에 도달하면 다시 시작하기를 원합니다. 또한 분이 59에 도달하면 시침을 증가시키고 싶습니다. 그것은 작동하지 않는 것 같습니다. 왼손의 시간 "손"은, 원한다면, 내가 원한다고 말했을 때도 증가하지 않을 것이다.스톱워치에서 시간이 작동하지 않습니다.

"5"설정 시간에주의하십시오. 나는 그 시간을 테스트했다. "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++; 

재설정해야이 부분 minGreater 및 minLesser는 secGreater/secLesser가 아닙니다. 로 변경 :

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

오와의 setTimeout/setInterval을 더 나은 대안으로 requestAnimationFrame로 본다.

관련 문제