Destroy previous setInterval

Question

I want a function to set an Ajax and a reload timer. The code below doesn't destroy the previous function call timer, so each time I invoke it I get another timer. How can I destroy the previous timer?

function initNowPlayingMeta(station) {     $('#cancion').children().remove();     $('#cancion').load('sonando.php?emisora=' + station);     var prevNowPlaying = setInterval(function () {         $('#cancion').load('sonando.php?emisora=' + station);     }, 5000); } 

Answer 1

You need to store your timer reference somewhere outside of local scope (this essentially means declaring it with var outside of the function). Then, clear it with clearInterval:

var prevNowPlaying = null;  function initNowPlayingMeta(station) {     if(prevNowPlaying) {         clearInterval(prevNowPlaying);     }     $('#cancion').children().remove();     $('#cancion').load('sonando.php?emisora=' + station);     prevNowPlaying = setInterval(function () {         $('#cancion').load('sonando.php?emisora=' + station);     }, 5000); } 

Answer 2

clearInterval

clearInterval(prevNowPlaying);

you will also want to make the prevNowPlaying from previous calls in scope whereever you try to cancel