Question

这是一个函数的片段。我得到每个图像的原始大小。然后我想做一个简单的if语句，但不能访问变量'imageWidth'。在'theImage.onload = function（）'之外获得'undefined'。怎么会超出范围？

    var parentWidth = $('figure.pack_image').width();
    var screenImage = $('figure.pack_image img');
    var imageWidth = '';

    screenImage.each(function () {

        var theImage = new Image();
        theImage.src = $(this).attr('src');

        theImage.onload = function() {
            imageWidth = this.width;

        }

        if (imageWidth > parentWidth) {
        ...

Answer 1

它不是“超出范围”，它还没有价值。在设置imageWidth之前，您无法对其进行测试，.onload调用是异步的。

您的测试需要在.onload函数中启动：

theImage.onload = function() {
    imageWidth = this.width;
    if (imageWidth > parentWidth) {
        ...
    }
}

或者，使用延迟回调来解除后续处理中的onload逻辑：

var gotImage = $.Deferred();
theImage.onload = function() {
    gotImage.resolve(this);
}

gotImage.done(function(img)) {
    if (img.width > parentWidth) {
         ...
    }
});

从加载函数访问变量

1 个答案: