이미지를 미리로드 할 때 Internet Explorer 루프 버그

Question

먼저 모든 이미지를 미리로드해야하는 JavaScript 응용 프로그램을 만들었습니다. 파이어 폭스에서는 모든 것이 잘 작동하지만 인터넷 익스플로러에서 루프는 19에서 카운트를 건너 뛰고 21로 간다. 누구든지이 문제를 우연히 만났고 그 원인은 무엇인가?

테스트 목적으로 아래 스크립트를 복사하여 붙여 넣을 수 있습니다.

var preLoad = function() { 
    var docImages = ["http://www.sanatural.co.za/media/images/map/rsa_prov.gif", "http://www.sanatural.co.za/media/images/map/loading.gif", "http://www.sanatural.co.za/media/images/map/loading2.gif", "http://www.sanatural.co.za/media/images/map/ec_land.gif", "http://www.sanatural.co.za/media/images/map/ec_roll.gif", "http://www.sanatural.co.za/media/images/map/ec_state.gif", "http://www.sanatural.co.za/media/images/map/fs_land.gif", "http://www.sanatural.co.za/media/images/map/fs_roll.gif", "http://www.sanatural.co.za/media/images/map/fs_state.gif", "http://www.sanatural.co.za/media/images/map/gt_land.gif", "http://www.sanatural.co.za/media/images/map/gt_roll.gif", "http://www.sanatural.co.za/media/images/map/gt_state.gif", "http://www.sanatural.co.za/media/images/map/kzn_land.gif", "http://www.sanatural.co.za/media/images/map/kzn_roll.gif", "http://www.sanatural.co.za/media/images/map/kzn_state.gif", "http://www.sanatural.co.za/media/images/map/lp_land.gif", "http://www.sanatural.co.za/media/images/map/lp_roll.gif", "http://www.sanatural.co.za/media/images/map/lp_state.gif", "http://www.sanatural.co.za/media/images/map/mp_land.gif", "http://www.sanatural.co.za/media/images/map/mp_roll.gif", "mp_state.gif", "http://www.sanatural.co.za/media/images/map/nc_land.gif", "http://www.sanatural.co.za/media/images/map/nc_roll.gif", "http://www.sanatural.co.za/media/images/map/nc_state.gif", "http://www.sanatural.co.za/media/images/map/nw_land.gif", "http://www.sanatural.co.za/media/images/map/nw_roll.gif", "http://www.sanatural.co.za/media/images/map/nw_state.gif", "http://www.sanatural.co.za/media/images/map/wc_land.gif", "http://www.sanatural.co.za/media/images/map/wc_roll.gif", "http://www.sanatural.co.za/media/images/map/wc_state.gif"], 
     imageFolder = [], 
     loaded = [], 
     loadedCounter = 0; 

    this.loadImgs = function() { 
     for (var i = 0; i < docImages.length; i++) { 
      imageFolder[i] = new Image(); 
      imageFolder[i].src = docImages[i]; 
      loaded[i] = false; 
     } 
     intervalId = setInterval(loadedCheck, 10); // 
    }; 

    function loadedCheck() { 
     if (loadedCounter == imageFolder.length) { // all images have been preloaded 
      clearInterval(intervalId); 
      alert('All images have been preloaded!'); 
      return; 
     } 

     for (var i = 0; i < imageFolder.length; i++) { 
      if (loaded[i] === false && imageFolder[i].complete) { 
       loaded[i] = true; 
       loadedCounter++; 
       alert(i); // (work fine in FF but i.e goes from 19 to 21) 
      } 
     } 
    } 
}; 


var preloadObject = new preLoad(); 

preloadObject.loadImgs(); 

Answer 1

그 이유는 인덱스 (20)에 대한 항목이 "mp_state.gif" 점이다 - 그것의 전체 URL이 없습니다. 이 때문에 이미지가로드되지 않고 .complete 속성이 false로 설정되어 루프에서이 항목을 건너 뜁니다.