Restarting a setInterval() in Javascript/jQuery (without clearInterval)

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.

Update

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-c开发者_如何学编程hange. 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).

// 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);

                //});

            }

No, there is no way to restart a timer set by setInterval without clearing the timer.

You can't really alter intervals or timeouts, only clear them. That said it should be a simple thing to create a function that clears the interval, and then starts a new but identical one immediately with a fresh time value.

var intervalID;
var resetTimer = function() {
  if (intervalID) { clearInterval(intervalID) };
  intervalID = setInterval(function() {
    console.log('doing stuff!');
  }, 5000);
};

timer = setInterval(function() {
  timerCom();
}, options.interval);

I know this post is well over 2 years old, but I ran into a similar problem just now, and I found a solution.

I was writing an image scroller that would automatically shift to the next image after a set amount of time, and whenever I clicked the navigation buttons, the transitions moved double-time.

Here's my solution:

Make the interval variable (timer in your case) somewhat global.

i.e. in the options section (assuming it was defined earlier, and then later assigned), add a null timer variable.

var options = {
'interval',
//Other variables
'timer',
};

Then, call clearInterval twice when you handle the click event.

$("#promo-items > li > a").click(function () {

if( options.timer != null ) {
clearInterval(options.timer);
clearInterval(options.timer);
}

options.timer = setInterval(timerCom, options.interval);

});

Worked like a charm for me.

Again, sorry if this is wayyyy too late.