Function calling itself not working (infinite loop, Javascript) - Stack Overflow

admin管理员组

文章数量:1026989

I'm trying to wait and then get a message when all images in an array have pleted loading (using plete), per the answer here. As such I set up an infinite loop like the below. however, when I run this I get an error that checkForAllImagesLoaded() is not defined. This code is being run through a bookmarklet, and as such it's all wrapped up in an anonymous function construct (as below). If I re-define my function and variable outside of that construct, it works. But that seems to be a poor way to write a bookmarklet. How can I fix this so it will still recognize the function after the setTimeout?

(function() {

    //var images = array of images that have started loading

    function checkForAllImagesLoaded(){
        for (var i = 0; i < images.length; i++) {
            if (!images[i]plete) {
               setTimeout('checkForAllImagesLoaded()', 20);
               return;
            }
        }
    }

    checkForAllImagesLoaded();

})();

I'm trying to wait and then get a message when all images in an array have pleted loading (using .plete), per the answer here. As such I set up an infinite loop like the below. however, when I run this I get an error that checkForAllImagesLoaded() is not defined. This code is being run through a bookmarklet, and as such it's all wrapped up in an anonymous function construct (as below). If I re-define my function and variable outside of that construct, it works. But that seems to be a poor way to write a bookmarklet. How can I fix this so it will still recognize the function after the setTimeout?

(function() {

    //var images = array of images that have started loading

    function checkForAllImagesLoaded(){
        for (var i = 0; i < images.length; i++) {
            if (!images[i].plete) {
               setTimeout('checkForAllImagesLoaded()', 20);
               return;
            }
        }
    }

    checkForAllImagesLoaded();

})();

• javascript
• function
• callback
• definition
• anonymous-function

Share Improve this question Follow edited May 23, 2017 at 10:24 CommunityBot 111 silver badge asked Jun 30, 2010 at 1:29 Red CollarRed Collar 11711 gold badge22 silver badges66 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 8

Remove the function call, and take out the quotes. If you don't put the quotes, setTimeout gets a direct reference to the function which it can invoke later. However, if inside a string such as "checkForAllImagesLoaded" or "checkForAllImagesLoaded()", then it will execute the code passed-in when the timeout occurs.

At that time, checkForAllImagesLoaded will be searched for in the global object (window) but it is not defined there, reason being why you're getting the undefined error.

Your code is wrapped in a self-calling anonymous function, and outside of it checkForAllImagesLoaded does not exist. So pass a direct reference to the function in your setTimeout call, instead of a string.

setTimeout(checkForAllImagesLoaded, 20);

setTimeout can be called with either a function (and optional arguments), or a string containing JavaScript code:

var timeoutID = window.setTimeout(func, delay, [param1, param2, ...]);
var timeoutID = window.setTimeout(code, delay);

Remove the () in the settimeout call.

setTimeout('checkForAllImagesLoaded', 20);

With your code, you set a number of timeouts per call. You should just set the timeout once per checkForAllImagesLoaded() call and perhaps increase the waiting period (20 milliseconds is just too quick). E.g.

function checkForAllImagesLoaded() {
  var allComplete=true;
  var i=0;

  while (i<images.length && allComplete) {
    allComplete=images[i++].plete;
  }

  if (!allComplete) { // Any inplete images?
    setTimeout('checkForAllImagesLoaded()',1000); // Wait a second!
  }
}

I'm trying to wait and then get a message when all images in an array have pleted loading (using plete), per the answer here. As such I set up an infinite loop like the below. however, when I run this I get an error that checkForAllImagesLoaded() is not defined. This code is being run through a bookmarklet, and as such it's all wrapped up in an anonymous function construct (as below). If I re-define my function and variable outside of that construct, it works. But that seems to be a poor way to write a bookmarklet. How can I fix this so it will still recognize the function after the setTimeout?

(function() {

    //var images = array of images that have started loading

    function checkForAllImagesLoaded(){
        for (var i = 0; i < images.length; i++) {
            if (!images[i]plete) {
               setTimeout('checkForAllImagesLoaded()', 20);
               return;
            }
        }
    }

    checkForAllImagesLoaded();

})();

I'm trying to wait and then get a message when all images in an array have pleted loading (using .plete), per the answer here. As such I set up an infinite loop like the below. however, when I run this I get an error that checkForAllImagesLoaded() is not defined. This code is being run through a bookmarklet, and as such it's all wrapped up in an anonymous function construct (as below). If I re-define my function and variable outside of that construct, it works. But that seems to be a poor way to write a bookmarklet. How can I fix this so it will still recognize the function after the setTimeout?

(function() {

    //var images = array of images that have started loading

    function checkForAllImagesLoaded(){
        for (var i = 0; i < images.length; i++) {
            if (!images[i].plete) {
               setTimeout('checkForAllImagesLoaded()', 20);
               return;
            }
        }
    }

    checkForAllImagesLoaded();

})();

• javascript
• function
• callback
• definition
• anonymous-function

Share Improve this question Follow edited May 23, 2017 at 10:24 CommunityBot 111 silver badge asked Jun 30, 2010 at 1:29 Red CollarRed Collar 11711 gold badge22 silver badges66 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 8

Remove the function call, and take out the quotes. If you don't put the quotes, setTimeout gets a direct reference to the function which it can invoke later. However, if inside a string such as "checkForAllImagesLoaded" or "checkForAllImagesLoaded()", then it will execute the code passed-in when the timeout occurs.

At that time, checkForAllImagesLoaded will be searched for in the global object (window) but it is not defined there, reason being why you're getting the undefined error.

Your code is wrapped in a self-calling anonymous function, and outside of it checkForAllImagesLoaded does not exist. So pass a direct reference to the function in your setTimeout call, instead of a string.

setTimeout(checkForAllImagesLoaded, 20);

setTimeout can be called with either a function (and optional arguments), or a string containing JavaScript code:

var timeoutID = window.setTimeout(func, delay, [param1, param2, ...]);
var timeoutID = window.setTimeout(code, delay);

Remove the () in the settimeout call.

setTimeout('checkForAllImagesLoaded', 20);

With your code, you set a number of timeouts per call. You should just set the timeout once per checkForAllImagesLoaded() call and perhaps increase the waiting period (20 milliseconds is just too quick). E.g.

function checkForAllImagesLoaded() {
  var allComplete=true;
  var i=0;

  while (i<images.length && allComplete) {
    allComplete=images[i++].plete;
  }

  if (!allComplete) { // Any inplete images?
    setTimeout('checkForAllImagesLoaded()',1000); // Wait a second!
  }
}

本文标签： Function calling itself not working (infinite loopJavascript)Stack Overflow