Question

I’ve run into an issue where my app lives in an iframe and it’s being called from an external domain. IE9 won’t fire the load event when the iframe loads properly so I think I’m stuck using setTimeout to poll the page.

Anyway, I want to see what duration is generally needed for my setTimeout to complete, so I wanted to be able to log the delay the setTimeout fires from my callback, but I’m not sure how to pass that context into it so I can log it.

App.readyIE9 = function() {
  var timings = [1,250,500,750,1000,1500,2000,3000];    
  for(var i = 0; i < timings.length; i++) {
    var func = function() {
    if(App.ready_loaded) return;
      console.log(timings[i]);
      App.readyCallBack();
    };
    setTimeout(func,timings[i]);
  }
};

I keep getting LOG: undefined in IE9’s console.

What’s the proper method to accomplish this?

Thanks

Answer 1

This is happening because you are not closing around the value of i in your func. When the loop is done, i is 8 (timings.length), which doesn’t exist in the array.

You need to do something like this:

App.readyIE9 = function() {
  var timings = [1,250,500,750,1000,1500,2000,3000];    
  for(var i = 0; i < timings.length; i++) {
    var func = function(x) {
      return function(){
          if(App.ready_loaded) return;
          console.log(timings[x]);
          App.readyCallBack();
      };
    };
    setTimeout(func(i),timings[i]);
  }
};