javascript - jQuery 或 Javascript 检查图像是否加载

Question

我知道 Stackoverflow 上有很多这样的东西，但我还没有在最近版本的 jquery (1.10.2) 中找到适合我的东西。

我试过:

$(".lazy").load(function (){}

但我相信经过一些研究后，使用 .load 来检测图像加载在 jQuery 1.8 中已被弃用。我需要做的是在加载图像后触发图像调整大小功能。我无法控制HTML，目前我必须在页面加载后通过附加属性(通过 .attr())通过 jQuery 添加图像尺寸，以便我可以使用 lazyload js。

问题是我需要一种准确的方法来推迟我所有的各种脚本，直到图像正确加载，否则函数有时会在每个图像加载之前触发。我试过使用 $(window).load(function (){}); 但它有时仍然会在每个图像加载之前触发。

Answer 1

我通常这样做:

var image = new Image();
image.onload = function () {
   console.info("Image loaded !");
   //do something...
}
image.onerror = function () {
   console.error("Cannot load image");
   //do something else...
}
image.src = "/images/blah/foo.jpg";

请记住，加载是异步的，因此您必须在 onload 和 onerror 事件中继续执行脚本。