jQuery通过引用获取图像的尺寸

Question

我正在加载带有图像引用的html

如何检索所引用的每个图像的实际像素宽度和高度？

    // loaded html:
    <div id="eleWithImgs">
        <img id="ph01" src=".../image01.jpg">
        <img id="ph02" src=".../image02.jpg">
        ...

    // JS:
('#parentEle').load('.../photos.html #eleWithImgs', function() {

    $('#eleWithImgs').children().each(function() {

        var origWidth = // get dimensions of the image

    });

});

Answer 1

您可以使用.height()和.width()函数来获取这些图片的宽度/高度。

尝试，

$('#eleWithImgs').children().each(function() {
    var origWidth = $(this).width();
    var origHeight = $(this).height();
});

Answer 2

您必须等待图像加载才能获得尺寸

$('#eleWithImgs').children().each(function() {
    this.onload = function() {
        var origWidth = this.clientWidth;
    }
    if(this.complete) this.onload();
});