2013-05-06 127 views
0

我有以下代碼來創建秒錶功能。我想要做的唯一事情就是創建startandstop按鈕作爲startandpause。但是我一直在絞盡腦汁想要找出如何做到這一點。任何幫助將不勝感激。謝謝!添加一個暫停按鈕

<script type="text/javascript"> 
<!-- Stopwatch 
    var stopwatch; 
    var runningstate = 0; // 1 means the timecounter is running 0 means counter stopped 
    var stoptime = 0; 
    var lapcounter = 0; 
    var currenttime; 
    var lapdate = ''; 


function timecounter(starttime) 
     { 
     currentdate = new Date(); 
     stopwatch = document.getElementById('stopwatch'); 
     var timediff = currentdate.getTime() - starttime; 
     if(runningstate == 0) 
      { 
      timediff = timediff + stoptime 
      } 
     if(runningstate == 1) 
      { 
      stopwatch.value = formattedtime(timediff); 
      refresh = setTimeout('timecounter(' + starttime + ');',10); 
      } 
     else 
      { 
      window.clearTimeout(refresh); 
      stoptime = timediff; 
      } 
     } 


function marklapH() 
      { 
      if(runningstate == 1) 
        { 
        if(lapdate != '') 
         { 
         var lapold = lapdate.split(':'); 
         var lapnow = stopwatch.value.split(':'); 
         var lapcount = new Array(); 
         var x = 0 
     for(x; x < lapold.length; x++) 
      { 
     lapcount[x] = new Array(); 
     lapcount[x][0] = lapold[x]*1; 
     lapcount[x][1] = lapnow[x]*1; 
       } 
     if(lapcount[1][1] < lapcount[1][0]) 
       { 
      lapcount[1][1] += 60; 
       lapcount[0][1] -= 1; 
      } 
      if(lapcount[2][1] < lapcount[2][0]) 
      { 
      lapcount[2][1] += 10; 
      lapcount[1][1] -= 1; 
       } 
     } 
     lapdate = stopwatch.value; 
     Hlapdetails.value += (++lapcounter) + '. ' + stopwatch.value + '\n'; 
     } 
    } 


function startandstop() 
     { 
     var startandstop = document.getElementById('startandstopbutton'); 
     var startdate = new Date(); 
     var starttime = startdate.getTime(); 
     if(runningstate==0) 
    { 
    startandstop.value = 'Stop'; 
    runningstate = 1; 
    timecounter(starttime); 
    } 
else 
     { 
     startandstop.value = 'Start'; 
     runningstate = 0; 
     lapdate = ''; 
     } 
    } 


function resetstopwatch() 
     { 
     lapcounter = 0; 
     stoptime = 0; 
     lapdate = ''; 
     window.clearTimeout(refresh); 
    if(runningstate == 1) 
    { 
    var resetdate = new Date(); 
    var resettime = resetdate.getTime(); 
    timecounter(resettime); 
    } 
else 
    { 
    stopwatch.value = "0:0:0"; 
    } 
} 


function formattedtime(unformattedtime) 
    { 
    var decisec = Math.floor(unformattedtime/100) + ''; 
    var second = Math.floor(unformattedtime/1000); 
    var minute = Math.floor(unformattedtime/60000); 
decisec = decisec.charAt(decisec.length - 1); 
second = second - 60 * minute + ''; 
return minute + ':' + second + ':' + decisec; 
} 
</script> 

回答

2

試試這個代碼,

<!DOCTYPE html> 
<html> 
<head> 

</head> 
<body> 
<div id="show"></div> 
<input type="button" id="start" value="start" onclick="countup()" /> 
<input type="button" id="pause" value="pause" /> 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script src="http://code.jquery.com/jquery-migrate-1.1.1.min.js"></script> 

    <script type="text/javascript"> 
    var h = 0; 
var m = 0; 
var s = 0; 
var ml = 0; 

document.getElementById("show").innerHTML = "0:0:0:0"; 
function countup() { 

ml++; 

if (ml > 99) { 

    s++; 
    ml = 0; 
} 
if (s >59) { 
    s = 0; 
    m++; 
} 

if (m >59) { 
    m = 0; 
    h++; 
} 

var t = h + ":" + m + ":" + s + ":" + ml; 

document.getElementById("show").innerHTML = t; 


} 

var timer; 
$("#pause").click(function() { 
    clearInterval(timer); 
}); 
$("#start").click(function() { 
    timer = setInterval(countup, 10) 
}); 
</script> 
</body> 
</html> 
+0

看起來不錯。不過,我會命名countup()而不是countdown(),因爲它就是這樣做的:-) – Matt 2013-05-06 06:29:33

+0

@Matt:肯定老兄 – 2013-05-06 06:43:43