SO 22147458

Stop countdown timer in Javascript

by Steve Jansen

HTML

<h1 id="move_countdown">--</h1>

<button id="startButton">Start</button>
<button id="stopButton">Stop</button>

JavaScript

(function () {
      var interval = null;
      var secs = 10;

      function countdown() {
          console.log('countdown', secs);
          if (secs > 0) {
              secs--;
              $('#move_countdown').html('' + secs);
              // recursively call this function 
              interval = window.setInterval(countdown, 1000, secs);
          } else {
              $('#move_countdown').html('--');
              interval = null;
              //some stuff happens here that shouldn't happen 
              // if the user decides to interrupt the countdown
          }
      }

      function startCoundown() {
          secs = 10;
          if (!interval) {
              countdown();
              $("#startButton").prop('disabled', true);
              $("#stopButton").prop('disabled', false);
          }
      }

      function stopCountdown() {
          if (interval) {
              window.clearInterval(interval);
              interval = null;
              $("#startButton").prop('disabled', true);
              $("#startButton").prop('disabled', false);
          }
      }

      $(document).ready(function subscribe() {
          $("#startButton").click(startCoundown);
          $("#stopButton").click(stopCountdown);
          $("#stopButton").prop('disabled', true);
      });
  })();