CODEWITHSUNDEEP
javascript
satya
satya

Reputation: 11

Calling nested function using javascript

I have this code which calls a function test() on body onload

<body onLoad="test();">

The Test function has 2 more functions drawLayers() ,StopAll().

function test() {

  function drawLayers() {
   timers = [];
        timers.push(setTimeout(drawMoon,800));
       timers.push(setTimeout(drawCircle1,2300));
        timers.push(setTimeout(drawCircle2,2700));
    timers.push(setTimeout(drawCircle3,3100));
        timers.push(setTimeout(drawCircle4,3500));
        timers.push(setTimeout(drawCircle5,3900));
        timers.push(setTimeout(drawtext2,4300));
        timers.push(setTimeout(drawtext,4700));
        timers.push(setTimeout(drawtext3,5100));
        timers.push(setTimeout(drawtext4,5500));
        timers.push(setTimeout(drawtext5,5900));
        timers.push(setTimeout(drawtext6,6300));
        timers.push(setTimeout(drawtext7,6700));
        timers.push(setTimeout(drawtext8,7100));
        timers.push(setTimeout(drawtext9,7500));
        timers.push(setTimeout(drawtext10,7900));



    }

 function StopAll() {
     alert('fsdfsdf');
        for (var i = 0; i < timers.length; i++)
             window.clearTimeout(timers[i]);
    }
}

What i want to do is Call the StopAL() function on click of a button, the html code looks like below

<a href="javascript:void(0);" onClick="StopAll();">

Its throwing error, "StopAll is not defined"

How do i call the StopALL() function?

Upvotes: 1

Views: 10444

Answers (7)

Kundan Bharadwaj
Kundan Bharadwaj

Reputation: 21

function test() {

    function drawLayers() {
        timers = [];
        timers.push(setTimeout(drawMoon,800));
        timers.push(setTimeout(drawCircle1,2300));
        timers.push(setTimeout(drawCircle2,2700));
    }

    var StopAll=function() {
        alert('fsdfsdf');
        for (var i = 0; i < timers.length; i++)
            window.clearTimeout(timers[i]);
    }
    return StopAll;
}
var obj= new test();
//to call StopAll function
obj();

Upvotes: 2

praveenpds
praveenpds

Reputation: 2936

test = function (){

  this.drawLayers = function() {
        this.timers = [];
        this.timers.push(setTimeout(drawMoon,800));       
    }

  this.StopAll = function() {
       alert('fsdfsdf');
        var t = timers.length
        for (var i = 0; i < t; i++)
             window.clearTimeout(this.timers[i]);
    }
}

 var testObj =  new test();
 testObj.StopAll()

Upvotes: 3

praveenpds
praveenpds

Reputation: 2936

(function test($) {
  function drawLayers() {  
  }
  //expose this to outside world ,public function
  $.StopAll = function() {
    alert('fsdfsdf');
  }
})(window);

StopAll();

Upvotes: 1

Dhepthi
Dhepthi

Reputation: 453

You can move the function StopAll() outside the test function and call it as specified. If suppose you need to access that function even in the test(), you can do like this

function test() {

.....
drawLayers();
StopAll() ;

}

function StopAll() {
     alert('fsdfsdf');
        for (var i = 0; i < timers.length; i++)
             window.clearTimeout(timers[i]);
    }

Declaration of function can be given outside and called any where you want

Upvotes: 0

Headshota
Headshota

Reputation: 21449

You'd better not use html attributes to bind event handler, you can do the same with the following code:

    window.onload = function(){
      document.getElementById("myLink").onclick = function(){
        StopAll();    
      }    
    }


  // Your functions

This way you'll ensure your dom is loaded and ready to call event handlers.

Upvotes: 0

hellosmithy
hellosmithy

Reputation: 279

This is a 'closure' problem. The function StopAll is within the scope of the test function, and therefore is undefined in the global scope in which you are trying to call it.

Closures are a tricky subject to grasp initially. There's a good explanation here: How do JavaScript closures work?

(by the way StopAll should really be called stopAll because capitalised functions are generally reserved for use with the new keyword.)

Upvotes: 4

Darin Dimitrov
Darin Dimitrov

Reputation: 1039588

The scope of those nested functions is restricted to the test function only. You cannot invoke them from the outside. If you need to do that you could externalize it from the test function.

Upvotes: 5

Related Questions