javascript - image.complete 总是返回真

Question

我希望在加载图像且不在浏览器缓存中时执行一些逻辑。问题是，使用 jQuery 中的 complete bool 值总是返回 true —— 即使图像不在浏览器缓存中。代码片段:

var elem = $('.my-img');
console.log(elem.prop('complete'));

这在 Chrome 和 Firefox 的控制台中始终记录为真。是否有任何解决方法，或者我是否错误地使用了该值？

Answer 1

...when an image is loaded AND it isn't in the browser cache...

据我所知，没有办法检查图像是否在缓存中。 complete 并没有告诉你这些；它告诉您第一部分(主要是)img 元素可用(例如，图像已加载，这意味着它可能在缓存中)或已损坏(或 a couple of other things )。

---

这可能是一个切线:

您的代码正在检查与 .my-img 选择器匹配的 first img 的 complete 标志。显然该图像是完整的(损坏或已加载)。如果你想检查匹配该选择器的所有图像，你需要某种循环，也许是map:

var flags = $(".my-img").map(function() { return this.complete; }).get();

当然，该数组中的任何 false 标志都可能在您获取它的那一刻就过时了，因为图像是通过 JavaScript 代码带外加载的。