JQuery在附加到DOM之前获取动态添加图片的高度

时间:2016-10-01 03:44:14

标签: jquery image dom dynamic-content

问题非常简单,我的意图是,稍后,根据图片使用的垂直空间将图片附加到3个不同的列中,这是我需要知道图片高度的原因。

以下是我的剧本

 $( document ).ready(function() {

 //----------------------------------image feed-----------------------------
//random generator
    //array length 
        arr = []; arr.length = 94; //Number of images
        $.each(arr, function(i,v){v = i+1; arr[i] = v;});
        //random
        var i= arr.length, j, temp;
        while(--i > 0){
            j = Math.floor(Math.random() * (i + 1));
            temp = arr[j]; arr[j] = arr[i]; arr[i]=temp;
            };
//end of image feed and random

//load all thumbnails

    window.imagesThumb = [];
    $.each(arr, function(i,v){
        myImagethumb = $(new Image()).attr({
            "src":"img/pictures/thumbnails/img"+v+".jpg",
            "id":v,
            "class":"image"
        }); 
        imagesThumb[i] = myImagethumb; 

    });


//--------------------------------END OF IMAGE FEED-------------------------

});  

1 个答案:

答案 0 :(得分:0)

在加载异步时尝试以下操作:

var i = new Image; 
i.src= 'https://YOUR_IMAGESRC'; 
i.onload = function(){ console.log(i.width, i.height) }

所以基本上,使用你的代码,你只需要这样做:

myImagethumb.onload = function(){/**...*/}

var i = new Image; 
i.src= 'https://media.giphy.com/media/l0HlSF89is7bCAjte/giphy.gif'; 
i.onload = function(){ alert(i.width); alert(i.height) }