size JavaScript´te görüntü boyutunu parametreniz olmadan belirle 0 <img> `etiketi

Question

JavaScript'i kullanarak, belgeye eklemeden belgede olmayan bir görüntünün boyutunu nasıl belirleyebilirim?

Resmi AJAX kullanarak indirebilir ve yüksekliğini ve genişliğini program aracılığıyla kontrol edebilir miyim?

şey gibi ... Bu benim ihtiyaçlarına uygun bu etkinin, işlevsellik sunuyorsa yüzden Raphael kullanarak olacak

var xmlhttp = new XMLHttpRequest(); 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     var imageSize = MEGIC_GET_FILE_SIZE_FUNCTION(xmlhttp); 
     alert("The image is "+imageSize.width+","+imageSize.height+"."); 
    } 
} 
xmlhttp.open("GET","lena.jpg",true); 
xmlhttp.send(); 

.

Answer 1

ajax'e ihtiyacınız yok.

var img = new Image(); 
img.onload = function() { 
    alert("The image is " + this.width + "x" + this.height); 
} 
img.src = "lena.jpg"; 

Answer 2

var img = new Image(); 
img.src = url; 
var height = img.height; 
var width = img.width; 

Answer 3

Bunu boyutudur ölçmek için belgeye eklemek gerekmez, ancak en azından kısmen yüke bunun için beklemek zorunda. İşte

var ImageLoader = { 
maxChecks: 1000, 
list: [], 
intervalHandle : null, 

loadImage : function (callback, url) { 
    var img = new Image(); 
    img.src = url; 
    if (img.width && img.height) { 
    callback (mg.width, img.height, url, 0); 
    } 
    else { 
    var obj = {image: img, url: url, callback: callback, checks: 1}; 
    var i; 
    for (i=0; i < this.list.length; i++) { 
     if (this.list[i] == null) 
     break; 
     } 
    this.list[i] = obj; 
    if (!this.intervalHandle) 
     this.intervalHandle = setInterval(this.interval, 30); 
    } 
    }, 

// called by setInterval 
interval : function() { 
    var count = 0; 
    var list = ImageLoader.list, item; 
    for (var i=0; i<list.length; i++) { 
    item = list[i]; 
    if (item != null) { 
     if (item.image.width && item.image.height) { 
     item.callback (item.image.width, item.image.height, item.url, item.checks); 
     ImageLoader.list[i] = null; 
     } 
     else if (item.checks > ImageLoader.maxChecks) { 
     item.callback (0, 0, item.url, item.checks); 
     ImageLoader.list[i] = null; 
     } 
     else { 
     count++; 
     item.checks++; 
     } 
     } 
    } 
    if (count == 0) { 
    ImageLoader.list = []; 
    clearInterval (ImageLoader.intervalHandle); 
    delete ImageLoader.intervalHandle; 
    } 
    } 
}; 

Answer 4

sizin için fiddle var: Bir seferde muhtemelen birden fazla görüntü için bunu yapmak gerekir ve bunun kısa sürede boyutu kullanılabilir gibi bir geri arama call varsa, benim ImageLoader modülünü kullanabilirsiniz. Sadece Image nesnesini kullanın.

Answer 5

görüntünün kaynağını biliyorsanız bir javascript görüntü nesnesi kullanabilirsiniz:

function MEGIC_GET_FILE_SIZE_FUNCTION(src){ 
    var img = new Image(); 
    img.src = src; 
    return {height: img.height, width: img.width}; 
}