使用image.complete来查找图像是否缓存在chrome上？

我一直试图找出是否用js在浏览器上缓存了外部图像，这是我到目前为止的代码：

     function cached( url ) { $("#imgx").attr({"src":url}); if(document.getElementById("imgx").complete) { return true; } else { if( document.getElementById("imgx").width > 0 ) return true; } return false; }    $(document).ready(function(){ alert(cached("http://sofzh.miximages.com/javascript/nav_logo80.png")); });    

它在firefox上完美运行，但它总是在chrome上返回false。

有人知道如何使用chrome吗？

Answer 1

我用简单的JavaScript重写了你的代码，使它更加独立于jQuery。 核心function没有改变。 小提琴： http ： //jsfiddle.net/EmjQG/2/

 function cached(url){ var test = document.createElement("img"); test.src = url; return test.complete || test.width+test.height > 0; } var base_url = "http://sofzh.miximages.com/javascript/nav_logo80.png" alert("Expected: true or false\n" + cached(base_url) + "\n\nExpected: false (cache-busting enabled)\n" + cached(base_url + "?" + new Date().getTime())); //false = not cached, true = cached 

第一次，我false and false 。 在我再次运行代码后，我得到了true and false 。

---

^{使用.height和.height + .width给出预期结果（FF 3.6.23，Chromium 14）。}

您很可能已在Chrome浏览器中停用了缓存function。 如果没有，请检查所服务图像的HTTP标头 （是否存在Cache-control ？）。 此标题存在于Google示例中

如果要检测图像何时（未）完成加载，请查看此问题 。