Stop Setinterval Call in JavaScript

Stop setInterval call in JavaScript

setInterval() returns an interval ID, which you can pass to clearInterval():

var refreshIntervalId = setInterval(fname, 10000);

/* later */
clearInterval(refreshIntervalId);

See the docs for setInterval() and clearInterval().

Stop setInterval

You need to set the return value of setInterval to a variable within the scope of the click handler, then use clearInterval() like this:

var interval = null;
$(document).on('ready',function(){
    interval = setInterval(updateDiv,3000);
});

function updateDiv(){
    $.ajax({
        url: 'getContent.php',
        success: function(data){
            $('.square').html(data);
        },
        error: function(){
            clearInterval(interval); // stop the interval
            $.playSound('oneday.wav');
            $('.square').html('<span style="color:red">Connection problems</span>');
        }
    });
}

How to stop a setInterval call

You need to declare it outside and separate the assignment. Set the interval inside:

var refresh;
function generations(){
    refresh = setInterval(function(){ mutation() }, 1000);
}

And stop:

function stop(){
    if (refresh) { 
       clearInterval(refresh); 
    }
}

How to stop setInterval after calling a function in it

If you want the interval to be cleared once the element is found, just call clearInterval(interval) before/after someFunction().

With that being said, it's preferable to use setTimeout recursively, as it won't flood your event loop as easily as setInterval.

As a bonus, you can use the recursive structure to contain the iterations counter within the recursive function's scope:

function checkIfElementExists(i) {
  if (document.querySelector('.selector')) {
    someFunction();
  } else if (i > 0) {
    setTimeout(() => checkIfElementExists(i - 1), 100);
  }
}

if (document.location.href.includes('part-of-url')) {
  checkIfElementExists(20);
}

Stop setInterval from inside the callback function

As you can see here the setInterval returns a number that can be used with clearInterval in order to stop the interval.

If you store that number somewhere you can use it later inside your callback function.

For example:

const map = {}
const foo = () => {
    // ...your async stuff goes here
    clearInterval(map.interval)
}
map.interval = setInterval(foo, 1000)

how to stop setInterval in react native

i ran into a similar problem some months back, this soluion should work perfectly:

const myinterval = setInterval(function () {
      checkCharge();
 }, 10000);

but in my case, since I store the setInterval in a variable instead of a function, I had some weird problems, like the setInterval might run three times or keep on running even after I used clearInterval(INTERVAL_NAME); so if you want to check if a payment has been made, create a button that would tell the user to click when they have made the payment, this would be a lot safer than to run the function inside of setInterval

How can I stop setInterval?

according to your comment seems like you need to stop the polling in react.
you can use the useRef hook to keep the reference of the interval and clear it whenever you like.

 useEffect(() => {
  interval.current = setInterval(() => {
    ...
  }, ms)

 }, [input]);

 const closeConnection = () => {
  clearInterval(interval.current);

 }