기존 ClickEvent를 버튼에 추가 하시겠습니까?

Question

나는 타이머를 자바 스크립트로 작성했습니다. 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; 
    } 
}; 

나는 또한 버튼을 클릭하면 타이머를 일시 중지하고 다시이 버튼을 클릭 (또는 타이머) 때 타이머를 다시 시작합니다. 현재 가지고있는 버튼 코드는 다음과 같습니다.

이렇게하는 방법은? 버튼이나 타이머를 클릭해도 문제가되지 않도록 타이머를 일시 중지하거나 다시 시작해야합니다.

많은 감사합니다.

Answer 1

이있어 : timer.el.trigger('click');이

Answer 2

클릭을 시뮬레이트 하시겠습니까? This post will help you