Исправлен таймер запуска при загрузке страницы

Question

Простой таймер Javascript, который работает в течение 30 секунд и отображает сообщение, когда оно достигает 0. Я не могу понять, как запустить его при нажатии кнопки вместо загрузки страницы.Любая помощь приветствуется:)

<script type="text/javascript">
var sec = 30;   // set the seconds
var min = 00;   // set the minutes

function countDown() {
  sec--;
  if (sec == -01) {
    sec = 59;
    min = min - 1;
  } else {
   min = min;
  }
if (sec<=9) { sec = "0" + sec; }
  time = (min<=9 ? "0" + min : min) + " min and " + sec + " sec ";
if (document.getElementById) { theTime.innerHTML = time; }
  SD=window.setTimeout("countDown();", 1000);
if (min == '00' && sec == '00') { sec = "00"; window.clearTimeout(SD); alert("Too slow."); }
}

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(function() {
  countDown();
});
</script>

Answer 1

<button onclick='countDown();'>Click Me</button>

И просто не вызывайте addLoadEvent () вообще.

Answer 2

Вот полная выборка с отображением запуска / остановки и оставшегося времени.

var gTimer = null

function endOfTimer() {
    console.log("here");
    window.alert('Too slow');
}

function start() {
    gTimer = window.setTimeout('endOfTimer', 1 * 1000);
}

Answer 3

Добавьте прослушиватель событий к кнопке в функции загрузки и затем вызовите countDown

 addLoadEvent(function() {
   var el = document.getElementById("startButton");   
     el.addEventListener("click", countDown, false); 
});

Вот полный пример ссылка