IE 11 中的 jQuery 1.8 不会在页面加载时触发图像加载事件答案

【问题标题】：jQuery 1.8 in IE 11 does not fire image load event on page loadIE 11 中的 jQuery 1.8 不会在页面加载时触发图像加载事件
【发布时间】：2015-08-12 05:09:31
【问题描述】：

我有一个动态加载图像的 .NET 应用程序。在图像加载之前，我会显示加载 gif。然后显示图像。

加载的 gif 图像大小为16x11。加载的图片全部调整为80px宽度。

此代码适用于 IE8-10（但不适用于 IE11）：

$(imagesToLoadList).each(function () {

    var image = $(this);
    var realSrc = image.attr('real-src');

    var demandedImageIndex = parseInt(categoryId) + (scrollCount * 10) + index;

    image.unbind();
    image.bind('load', { ImageIndex: demandedImageIndex }, ImageLoaded);
    image.attr('src', realSrc);

    index++;
});

function ImageLoaded(event) {

    //after image loaded 
}

在 IE 11 中，图像会加载，但不会调整为80px 并保持16x11。再次触发事件时，它将正确调整大小。（App 有一个滑块，所以每次更改滑块时都会调用 load 事件）。

关于如何解决这个问题的任何想法？

仅供参考，图像是否被缓存都没有关系。按照IE8 bug的思路思考

【问题讨论】：

请在jsfiddle.net上添加工作代码sn-p。
@SergeyDenisov 我不再从事这个项目，也没有可用的代码库。如果我回到这个问题，我会发布工作小提琴。
你看到我的回答了吗？你能评论一下吗？

标签： javascript jquery internet-explorer-11 image-loading jquery-1.8

【解决方案1】：

似乎它在 IE 11 中运行良好，即使使用 jQuery 1.8.0/1.8.3（现在最新的稳定版本是 1.11.3/2.1.4。点击预览以加载全尺寸图像 — JSFiddle：

var $img = $('img');

$img.one('click', function() {
    $img.one('load', function() {
        this.width = 320;
        this.height = 240;
        console.log('Image loaded');
    });

    this.src = $(this).data('large-src');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>

<img src="http://oi59.tinypic.com/nxtdsp.jpg"
     data-large-src="http://oi57.tinypic.com/fegkeb.jpg"/>

如果您提供带有错误的工作代码 sn-p，也许我可以帮助您。

【讨论】：