Javascript：圖像完整/加載事件未被觸發

Question

我有這個代碼，我想用它來檢查圖像的寬高比，然後加載它。

我的問題是，與綁定的函數回調image.complete事件沒有觸發。

我在哪裏錯了？

checkAspectRation : function(file){ 

    var reader = new FileReader(); 
    /*Read the file*/ 
    reader.readAsDataURL(file); 

    /*Callback */ 
    reader.onloadend = (function() { 

     var image = new Image(); 

     image.complete = function() { 
      // access image size here 
      console.log("Width: " + this.width); 
      console.log("Height: " + this.height); 
     }; 

     image.src = reader.result; 

     console.log(image); 
    }); 

}, 

這是圖像的加載後的值：

[編輯]

我以這種方式改變了，但它依然不工作

checkAspectRation : function(file){ 

    var image = new Image(); 
    image.onload = function() { 
     // access image size here 
     console.log("Width: " + this.width); 
     console.log("Height: " + this.height); 
    }; 

    var reader = new FileReader(); 

    /*Callback */ 
    reader.onloadend = (function() { 
     console.log(image); 
     image.src = reader.result;  
    }); 

    /*Read the file*/ 
    reader.readAsDataURL(file); 
}, 

Answer 1

已解決已更改：

var image = new Image(); 

與

var image = document.createElement("img"); 

這工作得很好：

checkAspectRation : function(file){ 

    var reader = new FileReader(); 

    /*Callback */ 
    reader.onloadend = function() { 

     //var image = new Image(); 
     var image = document.createElement("img"); 
     image.onload = function() { 
      // access image size here 
      console.log("Width: " + this.width); 
      console.log("Height: " + this.height); 
     }; 

     image.src = reader.result; 

    }; 

    /*Read the file*/ 
    reader.readAsDataURL(file); 
},