HTML5 - come ottenere la dimensione dell'immagine

Question

Ho questo script, è usato per recuperare la larghezza e l'altezza dell'immagine caricata dal browser.

di riferimento: http://renevier.net/misc/resizeimg.html

function createReader(file) { 
    reader.onload = function(evt) { 
     var image = new Image(); 
     image.onload = function(evt) { 
      var width = this.width; 
      var height = this.height; 
      alert (width); // will produce something like 198 
     }; 
     image.src = evt.target.result; 
    }; 
    reader.readAsDataURL(file); 
} 

for (var i = 0, length = input.files.length; i < length; i++) { 
    createReader(input.files[i]); 
} 

voglio accedere la larghezza e l'altezza dal valore di fuori della funzione createReader. Come lo posso fare?

Answer 1

Change "createReader" in modo che si passa in una funzione di gestore da chiamare quando l'immagine è disponibile:

function createReader(file, whenReady) { 
    reader.onload = function(evt) { 
     var image = new Image(); 
     image.onload = function(evt) { 
      var width = this.width; 
      var height = this.height; 
      if (whenReady) whenReady(width, height); 
     }; 
     image.src = evt.target.result; 
    }; 
    reader.readAsDataURL(file); 
} 

Ora, quando lo si chiama, si può passare in una funzione di fare tutto ciò che è si vuoi fatto con le dimensioni dell'immagine:

createReader(input.files[i], function(w, h) { 
    alert("Hi the width is " + w + " and the height is " + h); 
    });