javascript - Js - 如何每次都获取图像大小

Question

所以我有这段 Jquery 代码，该代码的目的是显示适合屏幕尺寸的图像。图像是动态加载的，即:它们将在需要时生成。我遇到的问题是，当我第一次加载图像时，图像的 height 和 width 为 0。有没有办法确保我始终获得图像的大小？

到目前为止，我的代码如下所示:

    var parent = document.getElementById('gallery-lightBox-large'),
        image = originalImages[currentIndex],
        original = document.createElement('img');

    parent.innerHTML = '';

    original.src = image.Url;

    var windowHeight = window.innerHeight * 0.8,    //  Allow for 10% margin
        windowWidth = window.innerWidth * 0.8;      //  Allow for 10% margin

    original.style.opacity = '0';
    original.style.position = 'absolute';
    original.style.zIndex = '-99';
    parent.appendChild(original);
    //console.info('original : ' + original.clientHeight, original.clientWidth);

    var elem = document.createElement('img');
    elem.src = image.Url;
    elem.clientHeight = original.clientHeight;
    elem.clientWidth = original.clientWidth;

    var width,
        height;

    if (windowHeight < windowWidth) {   //  Landscape mode
        if (original.clientWidth > windowWidth) {
            width = windowWidth;
        } else {
            width = original.clientWidth;
        }

        if (original.clientHeight > windowHeight) {
            width = undefined;
            height = windowHeight;
        } else {
            height = original.clientHeight;
        }
    } else {    //  Portrait mode
        if (original.clientHeight > windowHeight) {
            height = windowHeight;
        } else {
            height = original.clientHeight;
        }

        if (original.clientWidth > windowWidth) {
            height = undefined;
            width = windowWidth;
        } else {
            width = original.clientWidth;
        }
    }

    if (width != undefined) {
        if (width === 0) {
            width = 200;
        }
        elem.width = width;
    }

    if (height != undefined) {
        if (height === 0) {
            height = 200;
        }
        elem.height = height;
    }

    parent.appendChild(elem);

Answer 1

您可以尝试这种方式来检查加载后的图像大小

var img= document.getElementById('imgid');

img.onload = function () {
    alert(img.width + "," + img.height);       
};