2014-01-12 36 views
0

這不適用於chrome,,但是它的作用像firefox中的魅力這是爲什麼?我嘗試了很多組合,但沒有一個事件在Chrome中被解僱。addEventListener to Image在Chrome中不起作用

我已經徹底調試過了,而且我會完成所有的代碼!

進出口運行的Chrome版本31.0.1650.63米

for(var x = 0; x < 2; x++) 
{ 
    while(bFinishCheck == false) 
    { 
     img = new Image(); 


     img.addEventListener("load", function() { 
      // coming soon 
      alert('inside load'); 
     }, false); 
     img.addEventListener("error", function() { 
      // coming soon 
      alert('inside rror'); 
     }, false); 
     if (bCheckEnabled) { 

      img.src = 'Images/Cart/' + typeOfTiles[typeCounter] + '/' + tileCounter + '.png'; 

      console.log(img.src); 
      tileCounter++; 
     } 
    } 
} 
return imgArray; 
+0

在我的手機上,所以我無法測試這個。但是,因爲我從來沒有在JavaScript中看到過新的Image(),所以我非常驚訝,這是一種設置每個元素的事件處理程序的方法 – surfmuggle

+0

如果'img.onload = function(){...}適用於你只是爲了確定它在瀏覽器中的addEventListener實現沒有問題?我在'31.0.1650.57'上,並且在'addEventListener'方面我沒有問題。 –

+0

您可能在緩存時遇到問題。有關更多幫助,請參閱http://stackoverflow.com/questions/3877027/jquery-callback-on-image-load-even-when-the-image-is-cached#answer-3877079。 – sheng

回答

1

它沒有用匿名函數要麼但由於工作的意見,我最後只是這樣。與範圍的setInterval和Bind一起使用完整的屬性。這是爲了在掛鉤之前取消緩存觸發事件。很好地完成句柄!

DTE.prototype.LoadTileImages = function(typeOfTiles) 
{  
    var img; 
    var imgArray = new Array(); 
    var typeCounter = 0; 

    for(var x = 0; x <= 13; x++) 
    {  
     console.log("Fetching tile "+(x + 1)+" of " + 14); 
     img = new Image(); 
     img.src = 'Images/Cart/' + typeOfTiles[typeCounter] 
           + '/' + (x + 1) + '.png'; 
     imgArray.push(img); 
    }//end for loop!       

    this.tiles = imgArray; 
    setTimeout(this.InterValFunction.bind(this), 5); //Important does get called from Global! 

}; 

調用此函數..查看綁定以獲得正確的範圍!

DTE.prototype.InterValFunction = function() { 

    that = this; 
    this.loadedTiles = 1; 


    for (var i = 0; i < this.tiles.length; i++) { 

     if (!this.tiles[i].complete) {      
      var percentage = i * 100.0/(this.tiles.length); 
      percentage = percentage.toFixed(0).toString() + ' %'; 
      console.log("loading... " + percentage); 
      setTimeout(this.InterValFunction.bind(this), 20); 
     } 
     else 
     {     
      if(this.loadedTiles == this.tiles.length) { 
       console.log("loading... " + 100 +"%"); 
       this.DrawControlPanelTiles(this.tiles, this); 
      } 

      this.loadedTiles++;        
     } 
    }//End for 

    this.loadedTiles = 1; 
}; 
0

在很多瀏覽器(和蝙蝠我不記得哪一個),如果圖像已經緩存,然後空載甚至被解僱。

嘗試加入這一行:

img.src = 'Images/Cart/' + typeOfTiles[typeCounter] + '/' + tileCounter + '.png'; 
if (img.complete) { alert("Image complete - Image loaded from cache"); }