Question

我遇到了fancybox正在加载缓存图像的问题。我想确保图像在页面出现之前不会被缓存，但是我试图通过各种回调（beforeShow，afterShow，afterLoad，beforeLoad）来实现这一点并不成功。

这就是我目前所拥有的：

 $(".fancybox").fancybox({
          helpers: {
            overlay: {
              locked: false
            }
          }, 
          beforeShow: function(){
            if($('.fancybox-image').length>0){
              console.log($('.fancybox-image').attr('src'));
              clearCacheImages('fancybox');
            }
          }
        });

    function clearCacheImages(source){
      if(source == "all"){
        // console.log('loading all images');
        jQuery('img').each(function(){  
          jQuery(this).attr('src',jQuery(this).attr('src')+ '?' + (new Date()).getTime());  
        });  
      }else if(source=="fancybox"){
        // console.log('loading fancybox image: ' + $('.fancybox-image').attr('src'));
        $('.fancybox-image').attr('src',$('.fancybox-image').attr('src')+ '?' + (new Date()).getTime());
      }

    }

单击幻灯片幻灯片中的下一个按钮时，它会显示上一个图像而不是第一个图像。任何人都知道如何以及何时确保不缓存fancybox图像？

Answer 1

如果要始终在fancybox中加载非缓存图片，我要做的是使用?v=回调动态地将版本href试用参数添加到fancybox beforeLoad，如：

$(".fancybox").fancybox({
    beforeLoad: function () {
        this.href = this.href + "?v=" + new Date().getTime()
    }
});

这样，fancybox将始终（重新）加载图像而不是使用缓存图像。

参见 JSFIDDLE

fancybox确保fancybox-image没有被缓存

1 个答案: