火狐浏览器中图片的onload事件未触发

Question

我正在创建一个图片预加载程序。在除Firefox（使用Firefox 10.0测试）以外的所有浏览器中都可以正常工作。基本上，输入是一个名为image_list的图像数组。这些图像被动态附加到文档的主体上，并附加了一个载入回调函数，该函数调用update_progress函数。代码如下：

$(image_list).each(function() {
      var x = $('<img />')
       .load(function() {update_progress(percent_loaded += step);})
       .attr('src', this)
       .appendTo('body')
       .css('display', 'none');
       .each(function() {
          if(this.complete)
             update_progress(percent_loaded += step);
      });
});

在Firefox中，load回调和update_progress从未被调用。然而，在Chrome和我测试过的所有其他浏览器中，完全相同的代码都可以正常工作。有没有办法检测图像在Firefox中何时加载完成？

- Max Hartshorn

---

你看到了 http://api.jquery.com/load-event/ 上关于“在使用图片时使用load事件的注意事项”这部分吗？还有：https://dev59.com/pm865IYBdhLWcg3wUs3z - Blazemonger

谢谢Blazemonger，是的，我在API中看到了那个参考。我只是想知道是否有可靠的方法来检测图像加载完成。 - Max Hartshorn

你能提供一个 jsfiddle 吗？ - Ortomala Lokni

Answer 1

我会首先检查图像是否有高度，通过检查它的高度属性。

if (the_image.height > 0) {
  // The image is already loaded (possibly cached)
}

如果您有任何缓存的图像等内容，这应该可以帮助您解决这个问题。

- 3Dom