How can I pause setInterval() functions?

by

You could use a flag to keep track of the status:

var output = $('h1');
var isPaused = false;
var time = 0;
var t = window.setInterval(function() {
  if(!isPaused) {
    time++;
    output.text("Seconds: " + time);
  }
}, 1000);

//with jquery
$('.pause').on('click', function(e) {
  e.preventDefault();
  isPaused = true;
});

$('.play').on('click', function(e) {
  e.preventDefault();
  isPaused = false;
});
h1 {
    font-family: Helvetica, Verdana, sans-serif;
    font-size: 12px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Seconds: 0</h1>
<button class="play">Play</button>
<button class="pause">Pause</button>

This is just what I would do, I’m not sure if you can actually pause the setInterval.

Note: This system is easy and works pretty well for applications that don’t require a high level of precision, but it won’t consider the time elapsed in between ticks: if you click pause after half a second and later click play your time will be off by half a second.

More Related Contents:

  1. How would I make a Timer which times things in 0.75 seconds Javascript?
  2. Stop setInterval call in JavaScript
  3. setTimeout or setInterval?
  4. How can I make setInterval also work when a tab is inactive in Chrome?
  5. How to create an accurate timer in javascript?
  6. Changing the interval of SetInterval while it’s running
  7. Why does the setInterval callback execute only once?
  8. Javascript setInterval and `this` solution
  9. Stop setInterval
  10. Pass parameters in setInterval function
  11. Jquery/Ajax call with timer
  12. Will setInterval drift?
  13. Calculating Page Load Time In JavaScript
  14. JavaScript setTimeout() won’t wait to Execute? [duplicate]
  15. Viewing all the timeouts/intervals in javascript?
  16. How to make `setInterval` behave more in sync, or how to use `setTimeout` instead?
  17. setInterval timing slowly drifts away from staying accurate
  18. setInterval/setTimeout return value
  19. How to stop “setInterval” [duplicate]
  20. setInterval() behaviour with 0 milliseconds in JavaScript
  21. Is setInterval CPU intensive?
  22. Will setInterval cause browsers to hang?
  23. Using setInterval() to do simplistic continuous polling
  24. How to clearInterval with unknown ID?
  25. How to setInterval for every 5 second render with React hook useEffect in React Native app?
  26. function in setInterval() executes without delay
  27. setInterval not working properly on Chrome
  28. Does JavaScript setInterval() method cause memory leak?
  29. recursive function vs setInterval vs setTimeout javascript
  30. Making a live clock in javascript

Leave a Comment