Javascript: setInterval ‘Resumes’ вместо ‘Reset’ on нажмите кнопку

У меня есть проблема сброса прошедшего времени с помощью функции setInterval. Таймер работает хорошо при нажатии start и остановке его нажатием кнопки. Но когда я нажимаю кнопку Пуск снова таймер возобновляется вместо сброса. Основываясь на моих исследованиях ,clearInterval сбросил бы это, но не работает.

Вот пример моего кода. https://jsfiddle.net/4165y1x4/16/

HTML

<button id="get_data">Fetch Data</button>
<button id="stop1">Stop</button>
<span id="run-time"></span>
<br>

Яваскрипт

var start = new Date().getTime(),elapsed = '0.0';

var s , url,i=0, time;
$("#get_data").click(function() {
  s = setInterval(function() {
    $("#run-time").html(tym());

  }, 100);

});

$('#stop1').click(function() {
  clearInterval(s);
  time = null;
});


function tym() {
  $("#run-time").html('');
  time = new Date().getTime() - start;
  var min = (time / 1000 / 60) << 0;
  var sec = (time / 1000) % 60;

  if (sec < 10) {
    sec = '0' + sec;
  }

  return elapsed = 'Elapsed Time: ' + min + ':' + sec + ' (min:sec.mil).'
}

Надеюсь, кто-нибудь сможет помочь. С Наилучшими Пожеланиями!

1 ответ

  1. да на Rayon комментарий правильно, вы должны перезапустить время снова.JsFiddle

    var start,
        elapsed = '0.0';
    
    var s , url,i=0, time;
    $("#get_data").click(function() {
       start = new Date().getTime();
      s = setInterval(function() {
        $("#run-time").html(tym());
    
      }, 100);
      // getData();
    
    });
    
    $('#stop1').click(function() {
      clearInterval(s);
      time = null;
    });
    
    
    function tym() {
      $("#run-time").html('');
      time = new Date().getTime() - start;
      var min = (time / 1000 / 60) << 0;
      var sec = (time / 1000) % 60;
    
      if (sec < 10) {
        sec = '0' + sec;
      }
    
      return elapsed = 'Elapsed Time: ' + min + ':' + sec + ' (min:sec.mil).'
    }