StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PORestarting a setInterval() in Javascript/jQuery (without clearInterval)
text
Body
copied!<p>I'm working on ui tabs built using jQuery. Everything works except for one issue - I did a setInterval that runs a function that does a trigger("click") so that it goes to the next tab after 5000 miliseconds. It runs through each tab fine, the issue is that if the user manually clicks on a tab, the timer for the setInterval does not restart back at 0. For example if a user were to start on tab1 at 0 miliseconds and clicks on tab2 at 2000 miliseconds, the setInterval doesn't go back to 0, it would start at 2000 and run to 5000 miliseconds and would subsequently goto tab3. I understand why it's happening, I just wonder if there were a way to restart the setInterval timing without having to do a clearInterval() and creating an entirely new setInterval(). Any insight would be appreciated.</p> <p><strong>Update</strong></p> <p>Thanks for the replies - The reason I was trying to avoid using clearInterval was because I was having issues of how to write the code in a way where the clearInterval would stop the setInterval completely. The code is setup to track whenever a user has clicked a tab. The problem is the auto change function utilizes trigger('click'), so it runs the clearInterval function I wrote also when the tabs auto-change. It seems to run fairly fine on its own, but once the user starts clicking on tabs, the setInterval behaves unusually and switches tabs unpredictably. I suspect what is happening is that several setIntervals are running at once... Here's the code (If you haven't guessed it already, I'm pretty new at javascript/jquery). I've commented out parts so that it's functional, but it still doesn't function as I intended (from first post).</p> <pre><code>// auto change tabs if( options.interval ) { function timerCom() { if( !$(".controller").hasClass('paused') ) { var i = $(".tab-current > a").attr("rel"); //alert(i); if( i == 3 ) {i = 0}; $container .find('a') .eq(i) .trigger('click'); } } //$("#promo-items > li > a").click(function () { //var timer; //if( timer != null ) {clearInterval(timer);} timer = setInterval(timerCom, options.interval); //}); } </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload