javascript获取动态加载图片的宽度和高度？

一个是把图片 html()到HTML里面在获取

一个是用过URL ajax获取

只要图片加载完毕时才能获取到加载的图片的宽度和高度，你的意思是再图片加载前显示加载等待图片，然后再显示加载后的图片吧？
只要判断图片是否加载完毕，然后再获取图片属性，下面是个例子，不知道对你有没有帮助：
/** 动态获取图片的宽度和高度的像素值

          *
         * @param sUrl 图片的url
         * @param fCallback 回调函数，fCallback至少有一个类型为object类型的参数用来接收图片的宽、高、url
         * 
         * usage:
         * var url = "http://mat1.gtimg.com/datalib_img//11-05-26/c/c21ff1138e7349859b49b99312d05baf.jpg";
         * FGetImg(url, function(img){alert('width:'+img.width+";height:"+img.height+";url:"+img.url);});
         *
         */ 
        var FGetImg = function(sUrl, fCallback) 
        {    
        var img = new Image(); 
        img.src = sUrl + '?t=' + Math.random();    //IE下，ajax会缓存，导致onreadystatechange函数没有被触发，所以需要加一个随机数 
        if (FBrowser.isIE) 
        { 
            img.onreadystatechange = function() 
            { 
            if (this.readyState=="loaded" || this.readyState=="complete") 
            { 
                fCallback({width:img.width, height:img.height, url:sUrl}); 
            } 
            }; 
        }else if (FBrowser.isFirefox || FBrowser.isSafari || FBrowser.isOpera || FBrowser.isChrome) 
        { 
            img.onload = function() 
            { 
            fCallback({width:img.width, height:img.height, url:sUrl}); 
            }; 
        } 
        else 
        { 
            fCallback({width:img.width, height:img.height, url:sUrl}); 
    } 
 };

 

 

1. <script language="javascript" type="text/javascript">
2. $(function(){
3.     var im =newImage();
4.     im.src = $('#test').attr('loadsrc');
5.     $(im).load(function(){
6.       $('#test').attr('src',$('#test').attr('loadsrc'));
7.       alert(im.width);  //关键是这一句
8.     })        
9. });
10. </script>

转载于:https://www.cnblogs.com/ymj0906/p/3399805.html