js如何获取图片高度和宽度？

你说中文吧 2013-06-07 02:58:07



$(document).ready(function () {

            $('#tab1 img').each(function () {



                AutoResizeImage(this);

            })

        });

        function AutoResizeImage(objImg) {

            var img = new Image();

            img.src = objImg.src;

            // alert(img.src);

            w = img.offsetWidth;

            h = img.offsetHeight;

            alert(w);

            alert(h);

        }

 <table id="tab1">

        <tr>

            <td>

                <img src="img1.jpg" />

            </td>

        </tr>

        <tr>

            <td>

                <img src="img2.jpg" />

            </td>

        </tr>

        <tr>

            <td>

                <img src="img3.jpg" />

            </td>

        </tr>

    </table>

alert出来的全是0，应该如何获取呢

...全文

11903 15 打赏收藏转发到动态举报

写回复

用AI写文章

15 条回复

切换为时间正序

请发表友善的回复…

发表回复

qq_33422178 2016-01-26

打赏
举报

表示还是没有听懂

dethink 2015-12-03

打赏
举报

#10楼讲的很细致啊！

sumist 2014-06-23

打赏
举报

卖火柴的屌丝男 2013-06-07

打赏
举报

$(document).ready(function () {
            $('#tab1 img').each(function () {
                alert("width:" + $(this).width() + "  height:" + $(this).height());
            })
        });

你说中文吧 2013-06-07

打赏
举报

谢谢大家的回答

awenhao 2013-06-07

打赏
举报

网页加载的过程是这样的，首先加载的是document文档。也就是HTML，以及包含的js文件、css文件。加载完毕之后，才会继续加载各个图片，每个图片相当于一个单独的请求。所以当document的ready的时候，也就是加载完成的时候，图片可是还没有加载完成，是刚刚准备加载。此时你当然得不到图片的尺寸了。当image的load或者onreadystatechange事件，可以处理判断，得到image的尺寸。上面已经有兄弟说的很明白了，仔细看看吧

呵呵我来啦 2013-06-07

打赏
举报

引用

图片没加载完，就不能获取高宽么？来人啊，帮帮忙啊

如果设置了图片自身的高度和宽度当然是可以取出来的并且能够将从src那里获取的图片的高度和宽度变成你设置的那样，像你说的这样的只能等图片加载完成后才能得到它的实际宽、高。

汉尼拔 2013-06-07

打赏
举报

原因3楼说的很清楚了

你说中文吧 2013-06-07

打赏
举报

图片没加载完，就不能获取高宽么？来人啊，帮帮忙啊

你说中文吧 2013-06-07

打赏
举报

引用 5 楼 bbjbepzz 的回复:

var img = new Image(); img.src = objImg.src; img.onload = function(){ alert('width = ' + this.width + ' , height =' + this.height); }

确实弹出来了，能说下原因么？

bbjbepzz 2013-06-07

打赏
举报

var img = new Image(); img.src = objImg.src; img.onload = function(){ alert('width = ' + this.width + ' , height =' + this.height); }

你说中文吧 2013-06-07

打赏
举报

我觉得放在了的，但是不太懂，所以上长图片，

一天要饭生活又开始啦 2013-06-07

打赏
举报

引用 2 楼 u010868242 的回复:

[quote=引用 1 楼 veryhunger 的回复:]

你说中文吧，[/quote]

$(document).ready(function () {
            $('#tab1 img').each(function () {
 
                AutoResizeImage(this);
            })
        });
        function AutoResizeImage(objImg) {
            var img = new Image();
            img.src = objImg.src;
            document.body.appendChild(img);
            // alert(img.src);
            w = img.offsetWidth;
            h = img.offsetHeight;
            alert(w);
            alert(h);
        }

img没放dom里面啊

你说中文吧 2013-06-07