Question

我有一些可以缩放的预览图像。如果用户单击“缩放”，则会缓存图像：

var zoomImg = new Image();
      zoomImg.onload = function() {
      image.attr('src', zoomlist[currentFrame]);
   });

我需要知道的是，如何检查图像是否被缓存，以了解我是否应该显示加载器。

Answer 1

您可以像这样使用属性选择器。

if($('img[src="imageSource"]').length){
     //Image is present
}

注意：这将在DOM中找到img元素，而不是缓存。

Answer 2

您可以通过检查图像的完整和就绪状态属性来检查图像是否被缓存。

var zoomImg = new Image();
zoomImg.src = zoomlist[currentFrame];
if (zoomImg.complete || zoomImg.readystate === 4) {
    image.attr('src', zoomlist[currentFrame])
}
else {
    showLoader();
    zoomImg.onload = function() {
        hideLoader();
        image.attr('src', zoomlist[currentFrame]);
    });
}

如何基于src属性检查DOM中是否存在图像元素的Jquery？

2 个答案: