將現有ClickEvent添加到按鈕？

Question

我有一個用javascript寫的計時器。當我點擊我的HTML頁面中的計時器時，它會暫停。如果再次點擊它，它會繼續計數。

這是計時器代碼：

var Timer = function() {} 
Timer.prototype = { 
    refresh: null, 
    focus: null, 
    sec: 0, 
    min: 0, 
    hour: 0, 
    paused: false, 
    init: function(el) { 
     var that = this; 
     this.el = el; 
     this.clickEvent(); 
     return this; 
    }, 
    set: function(t) { 
     t = t.split(':'); 
     this.hour = t[0]; 
     this.min = t[1]; 
     this.sec = t[2]; 
     return this; 
    }, 
    bindFocus: function() { 
     var that = this; 
     clearInterval(this.focus); 
     if (document.hasFocus) 
      that.focus = setInterval(function() { 
       if (document.hasFocus()) { 
        if (that.paused) { 
         window.clearInterval(this.refresh); 
         that.go(); 
        } 
       } else 
        that.stop(); 
       }, 200); 
    }, 
    clickEvent: function() { 
     var that = this, frag = $('<h2>').addClass('pauseGame').text(texts.pause), toggleFlag = true; 
     this.el.bind('click', timerClicked); 
     function timerClicked(callback) { 
      if (!toggleFlag) 
       return; 
      toggleFlag = false; 
      if (that.paused === false) { 
       that.stop(); 
       window.clearInterval(that.focus); 
       $('#options > button').not('#options > .pause').prop('disabled', true); 
       $('#options > .pause').text('Resume'); 
       board.mainBoard.fadeOut(400, function() { 
        frag.css({ 
         letterSpacing: '25px', 
         opacity: 0 
        }); 
        $(this).after(frag).detach(); 
        frag.parent().addClass('paused'); 
        frag.animate({ 
         opacity: 1 
        }, { 
         queue: false, 
         duration: 400 
        }).animate({ 
         letterSpacing: '-4px' 
        }, 700, "easeOutBack", function() { 
         toggleFlag = true; 
        }); 
       }); 
       that.el.addClass('pause'); 
      } else { 
       $('#options > button').prop('disabled', false); 
       $('#options > .pause').text('Pause'); 
       options.undoToggle(); 
       frag.animate({ 
        opacity: 0, 
        letterSpacing: '25px' 
       }, 600, "easeInBack", function() { 
        $(this).parent().removeClass('paused').end().remove(); 
        board.container.prepend(board.mainBoard).removeAttr('style'); 
        board.mainBoard.fadeIn(400); 
        that.go(); 
        toggleFlag = true; 
       }); 
       this.className = ''; 
      } 
     } 
    }, 
    restart: function(el) { 
     this.sec = this.min = this.hour = 0; 
     this.el.text('00:00'); 
     this.stop().go(); 
    }, 
    go: function(now) { 
     var that = this; 
     this.paused = false; 
     if (now) 
      updateClock(); 
     window.clearInterval(this.refresh); 
     that.refresh = window.setInterval(updateClock, 1000); 
     function updateClock() { 
      that.sec++; 
      if (that.sec == 60) { 
       that.sec = 0; 
       that.min++; 
      } 
      if (that.sec < 10) 
       that.sec = "0" + that.sec; 
      if (that.min == 60) { 
       that.min = 0; 
       that.hour++; 
      } 
      var hours = (that.hour > 0) ? ((that.hour <= 9) ? "0" + that.hour : that.hour) + ":": ''; 
      that.el.html(hours + ((that.min <= 9) ? "0" + that.min : that.min) + ":" + that.sec); 
     } 
     return this; 
    }, 
    stop: function() { 
     this.paused = true; 
     window.clearInterval(this.refresh); 
     return this; 
    } 
}; 

我也想點擊一個按鈕時，暫停計時器，然後再次單擊此按鈕時（或定時器）恢復定時器。目前我的按鈕代碼是簡單的HTML：

<div id="options"> 
    <button class="pause" title="pause/resume the game">Pause</button> 
</div> 

那麼如何做到這一點呢？我需要它，所以如果你點擊按鈕或計時器，都沒關係，都應該暫停計時器或恢復計時器。

非常感謝

Answer 1

明白了： timer.el.trigger('click');的伎倆，我

Answer 2

想要模擬點擊嗎？ This post will help you