如何在第二次倒計時後停止Javascript計時器？

Question

我正在嘗試創建一個番茄鍾（一個倒計時25分鐘的生產力和5分鐘的休息時間倒計時），並且我無法停止休息時間倒計時。

這裏的JavaScript我到目前爲止：

function startTimer(duration, display) { 
    var timer = duration, minutes, seconds; 
    var countdown = setInterval(function() { 
     minutes = parseInt(timer/60, 10) 
     seconds = parseInt(timer % 60, 10); 

     seconds = seconds < 10 ? "0" + seconds : seconds; 

     display.textContent = minutes + ":" + seconds; 
     if (--timer < 0) { 
      clearInterval(countdown); 

      var breakClock = function() { 
       $("#title").text(function(i, text){ 
     return text === 'Breaktime' ? 'Productive Countdown' : 'Breaktime' 
      }); 

      var fiveMinutes = 60 * .05, 
        display = document.querySelector('#time'); 
      startTimer(fiveMinutes, display); 

      if (--timer < 0) { 
        clearInterval(this.countdown); 
      } 

      }; 

      breakClock(); 
      } 
    }, 500); 
}     
$(".startClock").click(function(){ 
    var twentyfiveMinutes = 60 * .25, 
     display = document.querySelector('#time'); 
    startTimer(twentyfiveMinutes, display); 
}); 

這裏是我的codepen：http://codepen.io/cenjennifer/pen/pjzBVy?editors=101

FYI：我的時間縮短，這樣我可以很容易地測試功能。

Answer 1

變化：

clearInterval(this.countdown); 

到：

clearInterval(countdown); 

不需要this關鍵字作爲countdown變量是breakClock()功能的父範圍的局部變量。