如何判斷圖像是否已經在IE9的瀏覽器緩存中？

IE9正顯示出假complete屬性與以下：如何判斷圖像是否已經在IE9的瀏覽器緩存中？

$("<img/>",{src:"http://farm2.static.flickr.com/1104/1434841504_edc671e65c.jpg"}).each(function(){console.log(this.complete);});

如果運行在瀏覽器控制檯這個代碼，（留出足夠的時間用於圖像加載），然後再次運行它。 IE9是我測試過的唯一一款第二次顯示錯誤的瀏覽器。這似乎是一個已知的錯誤，從一些簡單的谷歌搜索。 我需要一個解決方法，如果任何人有一個。

這可能是一個時間問題，因爲讓上面的代碼中設置一個全局變量一拉：

var img = $("<img....

，然後測試該變量的性質給出了不同的結果：

img[0].complete === true

和

img[0].readyState === "complete"

必須有一些其他的方式來獲得這個infom通貨膨脹。任何想法...謝謝！

來源

2011-12-01 bodine

這不是基本上相同的問題[你問11個小時前]（http://stackoverflow.com/questions/8338770/why-am-i-getting-a-false-only-in- IE9換圖像完整的屬性）？ –

@ Xeon06確實存在細微的差異，他們的其他問題似乎是措辭，以至於它詢問錯誤本身。在這裏我要求一個解決方法，再加上簡化的代碼在這個問題中可能不那麼令人困惑。 – bodine

'如果（image.complete || image.readyState ==「complete」）'是你將如何測試，如果它的緩存 – Esailija

-2

，如果它的緩存你不能說，但你可以通過「鹽析」的文件名強制新鮮負載：

src:"http://farm2.static.flickr.com/1104/1434841504_edc671e65c.jpg?"+new Date()

來源

2011-12-01 20:48:03

其實我不想重新加載圖像，這是重點。加載事件只會觸發一次，之後如果我嘗試再次構建此圖像，它應該在瀏覽器緩存中找到它。 – bodine

這是怎麼了，我通常預加載圖像：

var img = new Image(); 
$(img).attr('src', "foo.jpg"); 
if (img.complete || img.readyState === 4) { 
    // image is cached 
    alert("the image was cached!"); 
} else { 
    $(img).load(function() { 
     // image was not cached, but done loading 
     alert("the image was not cached, but it is done loading."); 
    }); 
}

我還沒有在IE9中深入調試過，但我沒有遇到任何問題。

該代碼被從https://github.com/tentonaxe/jQuery-preloadImages/blob/master/jquery.preloadimages.js中拉出並修改。

來源

2011-12-01 20:55:43

在IE9中運行該代碼，並帶有實際圖像，並且每次都會加載它。發佈在我的問題中的代碼是與您在此處發佈的內容類似的更大塊的一部分。看到我的其他[問題]（http://stackoverflow.com/questions/8338770/why-am-i-getting-a-false-only-in-ie9-for-image-complete-property） – bodine

很高興知道，我將不得不在晚些時候深入研究。 –

您可以嘗試圖像上的AJAX請求並查看狀態碼。如果它是304，則意味着圖像被緩存。不知道這會有多好，但。也許AJAX做一些緩存破壞。

來源

2011-12-01 20:56:23

我用這個：

function doWhenLoaded(obj,callback) { 

if($.browser.msie) { 
    var src=$(obj).attr("src"); 
    $(obj).attr("src",""); 
    $(obj).attr("src",src); 
} 

$(obj).one("load",callback).each(function(){ 
    // alert(this.readyState+" "+this.src); 
    if(
     this.complete 
     || this.readyState == "complete" 
     || this.readyState == 4 
     || ($.browser.msie && parseInt($.browser.version) == 6) 
    ) { 
     $(this).trigger("load"); 
    } 
}); 
}

樣本：

doWhenLoaded("#main_background_img",function(){ 
    $("#main_background_img").slideDown(1000); 
});

來源

2012-03-27 20:17:13 Francesco

我知道這是一個萬年前問過，但我想我會貢獻我的解決方案，它是類似的，但開銷較少和I/O。

基本上，你創建一個執行於一身的功能類似的壯舉定製的jQuery方法：

$.fn.imgLoad = function(callback) { 
    return this.each(function() { 
     if(callback){ 
      if(this.complete || (this.readyState === 4) || (this.readyState === 'complete')) { 
       callback.apply(this); 
      } else { 
       $(this).one('load.imgCallback', function(){ 
        callback.apply(this); 
       }); 
      } 
     } 
    }); 
}

這將所有可能事件的檢查到一個（包括緩存和非高速緩存），也使得方法可鏈接。你可以這樣稱呼它：

$('img').imgLoad(function(){ 
    console.log('loaded'); 
});

工作跨瀏覽器，回到IE6。請注意，它首先檢查緩存，並且如果不觸發命名空間加載事件一次，以防止在您使用該邏輯調用該函數兩次時重新加載，但也允許自定義加載事件被綁定（如果適用）。

來源

2014-09-12 00:42:10 PlantTheIdea

如何判斷圖像是否已經在IE9的瀏覽器緩存中？

回答

相關問題