前端圖片緩存問題


最近做圖片展示需求,發現更換了輪播的圖片(名字保留原來相同),但是仍然加載了舊的圖片,因為瀏覽器存在緩存機制的問題..

查找了一些資料,總結出2個步驟:

1.在<head>中加入這3句話:

<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="expires" content="0"/>

表示不要緩存數據

 

2.在圖片src路徑后面加上隨機數,使瀏覽器認為每次加載的不是同個圖片。

例子:

<ul class="imglist" >
     <li>
          <a><img width="188" height="150" src="/images/photo/ico/pic_1_0128.jpg?random="></a>
     </li>
</ul><!--imglist end-->
//在圖片路徑后面加上隨機數,處理緩存問題。
        $(".imglist").find("li").each(function(index,domEle){
            var obj = $(this).find("a").find("img");
            obj.attr("src",obj.attr("src")+Math.random());
        });
 
 
暫時還沒找到其他更好的方法,待更新...如有朋友有好的方法,歡迎討論。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM