CODEWITHSUNDEEP
javascriptjquery
Jamie Hutber
Jamie Hutber

Reputation: 28106

Why is this JS variable being run on page load

I don't understand why MC.caro.myTimer() is being run on a page load, its a variable. So how is this getting run without me calling it.

I thought it might be something to do with my auto executing function? 

    var MC = {};

    (function($){
        "use strict";

        MC.init = function (){
            //disable to turn off carousel
            MC.caro.init();
        };

        MC.caro = {
            init: function(){
                //Build carousel for us to use
                MC.caro.build();
                //Bind click events to buttons
                $('.mc-carousel--nav--buttons').on('click','li',function(){
                    MC.caro.advance($(this));

                    //stop the current ticking
                    MC.caro.stopMyTimer();

                    //Start up movement after 15seconds
                    setInterval(function(){MC.caro.myTimer()},10000);
                    console.info('running');
                });
            },
            build: function(){
                MC.caro.jsonRun(function(){
                    console.info('running1');
                });
            },
            myTimer: function(){
                console.info('running2');
                MC.caro.advance(nextItem,'slow');
            },
            //Sets up the timer
            timer:setInterval(function(){MC.caro.myTimer()},5000),
            stopMyTimer: function(){
                clearInterval(MC.caro.timer);
            }
        }
    })(jQuery);

    MC.init();

There is another problem:

when i click on $('.mc-carousel--nav--buttons').on('click','li',function(){ the code will wait 15 seconds then run. As expected. but if i click it 5 times really quickly it will wait those 15seconds then run in exactly the same time and order i clicked, meaning that MC.caro.stopMyTimer(); isn't working which is called inside my click event.

Also, this isn't the complete code, i can't put it into fiddle either as it has big dependencies on an intranet.

So appoligies that you can't see a working example.

Upvotes: 0

Views: 83

Answers (2)

Nazar
Nazar

Reputation: 1509

I think @JamieHutber is correct; setInterval is evaluated immediately and assigned to the timer property.

Try:

timer: function() {
  setInterval(function(){MC.caro.myTimer()},5000);
}

to initiate the timer via timer(). If you require this to be assigned to a variable then:

timer: function() {
  this._timer = setInterval(function(){MC.caro.myTimer()},5000);
}

HTH

Upvotes: 1

Dogbert
Dogbert

Reputation: 222348

You're setting it to the return value of setInterval

timer: setInterval(function(){MC.caro.myTimer()},5000),

This is evaluated immediately.

Upvotes: 1

Related Questions