開始 - 停止 - 復位使用jQuery

Question

我有一個看起來像這樣

JS

var counter = 0; 
var timer = setInterval("tictac()", 1000); 

function tictac(){ 
    counter++; 
    $("#clock").html(counter); 
} 

HTML代碼

<div id="clock">0</div> 
<div id="buttons" class="clear"> 
    <button id="start">start</button> 
    <button id="stop">stop</button> 
    <button id="reset">reset</button> 
</div> 

我如何可以利用簡單的計時器用於控制定時器的按鈕，當啓動時啓動按鈕被啓動sed，當停止時停止計數按下按鈕並重置計數器時重置按鈕被按下。

有人可以幫忙嗎？

我成功地做到這

 $(document).ready(function($) { 

      var timer = undefined; 
      $('#start').on('click', function(){ 
       timer = window.setInterval('tictac()', 1000); 
      }); 
      $('#pause').on('click', function(){ 
       window.clearInterval(timer); 
      }); 
      $('#reset').on('click', function(){ 
       timer = window.clearInterval(timer); 
      }); 

     }); 

     var counter = 0; 
     function tictac(){ 
      counter++; 
      $("#clock").html(counter); 
     } 

的啓動和停止按鈕做的工作，但復位將無法正常工作，能有一個人檢查有什麼錯的代碼？漂亮請

Answer 1

你可以利用onclick到你的按鈕。例如：<button onclick="tictac()">。爲了進一步解釋，你可以看到這個link。有一個演示可以解決你的問題。另外，您可以查看源代碼。

Answer 2

嘗試http://jsfiddle.net/vishalgupta358/DkTWN/

var counter = 0; 
var timer = null; 

function tictac(){ 
    counter++; 
    $("#clock").html(counter); 
} 

function reset() 
{ 
clearInterval(timer); 
    counter=0; 
} 
function startInterval() 
{ 
timer= setInterval("tictac()", 1000); 
} 
function stopInterval() 
{ 
    clearInterval(timer); 
} 

Answer 3

釘在解決

$('#reset').on('click', function(){ 
    counter = -1; 
    tictac(); 
    window.clearInterval(timer); 
});