setinterval метод не работает

Question

У меня есть кнопка, которая запускает функцию внутри заданного интервала каждые 1 сек. Значение кнопки изменяется на остановку. Когда я нажимаю стоп, я вызываю метод clearinterval. По какой-то причине метод clear interval не работает.

Это мой вход

<input id="trigger" type="button" value="start"/> 

мой JS функция

$(function() { 
    $('#trigger').click(function() { 
     var timerId = 0; 
     var trigger = $('#trigger').val(); 

     if(trigger == 'start') { 
      timerId = setInterval(function() { 
       $('#trigger').val('stop'); 
       main(); 
      }, 1000); 
     } else if(trigger == 'stop') { 
       clearInterval(timerId); 
       $('#trigger').val('start');     
     } 
    }); 
}); 

Answer 1

Вы timerId определяется локальными для сферы клик(), так что при запуске его во второй раз (в событии остановки) снова будет 0. Попробуйте это

var timerId = 0; 
$(function() { 
    $('#trigger').click(function() { 
     var trigger = $('#trigger').val(); 

     if(trigger == 'start') { 
      timerId = setInterval(function() { 
       $('#trigger').val('stop'); 
       main(); 
      }, 1000); 
     } else if(trigger == 'stop') { 
       clearInterval(timerId); 
       $('#trigger').val('start');     
     } 
    }); 
}); 

Answer 2

Вы повторно инициализируете таймер каждый раз, когда нажимается #trigger. Переместите var timerId = 0; вне функции щелчка