計時器不工作

-2

我的問題是計時器不能正常暫停。當我暫停時，它看起來已停止，但實際上它繼續循環，當我點擊開始時，它不會從我暫停的地方繼續，而是從它已到達的位置繼續。計時器不工作

<div class="stopwatch"> 
    <span>00:00:00,000</span><br /> 
    <div class="btn start">play</div> 
    <div class="btn pause">pause</div> 
    <div class="btn reset">reset</div> 
</div>

$(function(){ 
    var reload = 1000/60; 
    var timer = null; 
    var startTime = 0; 
    var btn = $('.stopwatch a'); 
    var count = $('.stopwatch span'); 
    var pause = false; 

    $('.pause').click(function(){ 
     pause = true; 
    }); 
    $('.start').click(function(){ 
     pause = false; 
    }); 
    $('.reset').click(function(){ 
     return ((count.text('00:00:00,000')) && (timer = 0)); 
    }); 

    function zero(num, length) { 
     if (typeof(length) == 'undefined') length = 2; 

     while (num.toString().length < length) { 
      num = '0' + num; 
     } 
     return num; 
    } 

    function zero_format(time){ 
     return zero(time.getUTCHours()) + ':' + zero(time.getMinutes()) + ':' + zero(time.getSeconds()) + ',' + zero(time.getMilliseconds()); 
    } 

    $('.start').click(function(){ 
     if (!timer){ 
      startTime = new Date(); 
      timer = setInterval(function(){ 
       if (pause){ 
        return; 
       } 

       var currentTime = new Date(new Date() - startTime); 
       count.text(zero_format(currentTime)); 
      }, reload); 
     } 
     return false; 
    }); 
});

來源

2013-01-15 Niki Lichev

代碼對我很好。你能否讓你的問題更清楚？ – Ergec

任何登錄螢火蟲？ –

暫停 - >開始後，我發現它工作不正常。它看起來像計時器實際上並沒有停止 –

你有兩個處理程序$('.start')創建日期時間的時間差異。

試試這個：Live Demo

$('.start').click(function(){ 
    if (!timer){ 
     startTime = new Date(); 
     timer = setInterval(function(){ 
      if (pause){ 
       return; 
      } 

      var currentTime = new Date(new Date() - startTime); 
      count.text(zero_format(currentTime)); 
     }, reload); 
    } else { 
     pause = false; 
    } 

    return false; 
});

而且刪除這樣的：

$('.start').click(function(){ 
    pause = false; 
});

更新1

如果你需要一個秒錶，沒有一個圈定時器，那麼這裏就是代碼：Live Demo

var savedTime; 
var additional = 0; 

$('.pause').click(function(){ 
    savedTime = new Date(); 
    pause = true; 
}); 

$('.reset').click(function(){ 
    count.text('00:00:00,000'); 
    clearInterval(timer); 
    timer = null; 
    additional = 0; 
}); 

$('.start').click(function(){ 
    if (!timer){ 
       startTime = new Date(); 
     timer = setInterval(function(){ 
      if (pause){ 
       return; 
      } 

      currentTime = new Date(new Date() - startTime - additional); 
      count.text(zero_format(currentTime)); 
     }, reload); 

     pause = false; 
    } 

    if(pause == true) { 
     additional += new Date() - savedTime; 
     pause = false; 
    } 

    return false; 
});

來源

2013-01-15 13:46:45 ATOzTOA

更新的答案和演示。 – ATOzTOA