javascript – 使用image.complete查找图片是否缓存在chrome上？

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

<html>
    <head></head>
    <body>

    <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>

    <script>

        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;
        }

    </script>

    <img id="imgx" src=""  />

    <script>

        $(document).ready(function(){
            alert(cached("http://www.google.com/images/srpr/nav_logo80.png"));
        });

    </script>

    </body>
</html>

它在firefox上完美运行,但它总是在chrome上返回false.

有人知道如何使用chrome吗？

解决方法

我用简单的JavaScript重写了你的代码,使它更加独立于jQuery.核心功能没有改变.
小提琴： 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://www.google.com/images/srpr/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

第一次,我弄错了.在我再次运行代码后,我得到了真实和错误.

使用.complete和.height .width给出了预期的结果(FF 3.6.23,Chromium 14).

您很可能已在Chrome浏览器中停用了缓存功能.如果没有,请检查所服务图像的HTTP headers(是否存在缓存控制？).此标题存在于Google示例中

如果要检测图像何时(未)完成加载,请查看this question.

javascript – 使用image.complete查找图片是否缓存在chrome上？

解决方法

相关推荐