Jquery 什么'；开始下载图像的事件是什么？

我知道

jQuery.load（）

，当一个

完成下载时就会触发它

我想知道浏览器开始下载图像时触发了什么事件。通常，浏览器在第一时间就知道图片的大小，然后需要一段时间（取决于图片大小）才能下载图片

我想附加一个事件，以便在浏览器知道图片大小后，或在浏览器开始下载图片时，立即知道图片大小

[编辑]

---

感谢@jfriend00的建议，现在我使用

setInterval

检查大小。但不是图片的大小，有些浏览器只是在下载完成之前不告诉你。所以我检查了容器的大小。一旦浏览器知道图片大小，它将调整容器大小。Wala，完成。

恐怕不存在一个

onStartLoad

事件。您需要使用您似乎已经知道的“加载”事件

有一种不安全的方法可以做到这一点

$(function() {
    $(imgNodeSelector).on('load', function(){
        //do stuff here
    });
});

这是不安全的，因为一些浏览器可以在“onDomReady”事件触发之前加载缓存的图像，在这种情况下，加载处理程序放置得太晚，它将“错过机会”。因此，更安全的做法是：

HTML:

---

浏览器不提供特殊事件来告诉您它知道图像大小的最早时间（在完成图像下载之前）。您所能做的就是设置一个适当的加载处理程序，以便知道映像何时完成下载，然后知道其大小

在某些浏览器中，在加载完整图像之前稍早获取高度和宽度的一种蛮力方法是轮询加载图像是否存在

.width

和

.height

。在Chrome中，它有时在触发

onload（）

事件之前可用。我还没有在其他浏览器中测试过

---

如果您使用onload处理程序，并且带有

.src

特定标记的图像标记位于页面的HTML中，则确保在加载时收到通知的唯一方法是放置一个内联图像处理程序，以便从一开始就安装处理程序：

<img src="xxx.jpg" onload="handleLoad(this)">

---

注意：使用动态创建的图像对象执行此操作时，必须先设置

onload

处理程序，然后再设置

.src

值。在IE的某些版本中，如果缓存图像，则在设置

.src

值时，加载事件将立即触发。因此，如果先设置

.src

，然后设置

onload

处理程序，如果图像在浏览器缓存中，您将错过

onload

事件。

是否在HTML中指定维度？可能重复-，尽管图像开始下载时浏览器会呈现一个框，JavaScript在完全下载之前无法检索图像的维度。我能想到的最好方法是发送一个带有

范围
头的ajax请求，以仅获取图像的头，然后手动解析头以获取维度。虽然不太可靠，但这取决于图像格式。Op在他的问题中有，甚至第一句。这就是他所拥有的；他希望另一个事件能够更快地触发（当维度可用时，而不是当图像完全下载时）。这很公平，但不可用。我很抱歉。这是你能做的最好的了。“动态创建的图像”=>“动态创建的图像节点”@Beetroot-Beetroot-动态创建的图像对象就是我的意思。我已经编辑了我的答案来使用这个术语。图像对象/图像节点不是一回事吗？至少在Chrome上，他们给了我同样的东西。是的，我知道你的意思，但你写的东西是误导性的。。。我刚刚投了反对票，希望得到一个更好的答案@pimvdb-图像对象或图像节点在此上下文中基本上是相同的。我更喜欢用“对象”这个词，所以这就是我在回答中使用的。
$(function() {
    $("img.delayedLoad").each(function() {
        $img = $(this);
        $img.on('load', function() {
            //do stuff here
        }).attr('src', $img.data('src'));
    });
});

<img src="xxx.jpg" onload="handleLoad(this)">

var img = new Image();
img.onload = function() {
    // the image is now loaded here and height and width are known
};
img.src = "xxxx.jpg";