javascript - 在 ie8 中未调用图像的 onload 回调

Question

我正在尝试预加载图像并将高度和宽度设置为容器。

问题似乎与 ie8 中的缓存有关，因为它无法在后续刷新时加载。

我查阅并尝试了多种解决方案，但似乎没有任何效果，至少不是始终如一。

当前的 Javascript:

    img = new Image();
    img.src = '/images/site/image.jpg';
    img.onload=function(){
        var width = img.width + 'px';
        var height = img.height + 'px';

        $('#container').css({'width':width,
                          'height':height
        });
    };

感谢任何建议，谢谢。

Answer 1

您必须在设置src 之前设置onload 回调。

缓存图像时，不会使用您的代码调用 onload 回调，因为 load 事件是在设置回调之前生成的。

这样做:

img = new Image();
img.onload=function(){
    var width = img.width + 'px';
    var height = img.height + 'px';

    $('#container').css({'width':width,
                      'height':height
    });
};
img.src = '/images/site/image.jpg';