如何檢查圖片是否加載？

如何檢查圖片是否已經加載？如何檢查圖片是否加載？

image.src = ay.url_static + 'uploads/apps/' + thumbnail.uid + '.png'; 
image.onload = function(e) 
{     
    // [..] 
};

我知道如何在圖像加載時觸發回調，但如何檢查圖片是否在此刻加載？

來源

2012-05-14 Gajus

你使用的是jQuery嗎？ – tybro0103

@ tybro0103，我可以。這將如何幫助？ – Gajus

這篇文章有一些額外的好信息：http://stackoverflow.com/questions/1268557/what-workarounds-exist-for-the-complete-property-in-firefox – tybro0103

我不確定你想要什麼，但根據我的理解，你需要知道圖像是否隨時加載，對嗎？

我有一個函數檢查圖像是否有效。如果需要，您可以使用它來查看圖像是否已經加載。如果您不想知道圖像是否有效，則只能使用img.complete屬性。

function IsImageLoaded(img) { 

    if (!img.complete) { 
     return false; 
    } 

    if (typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) { 
     return false; 
    } 

    return true; 
}

來源

2012-05-14 19:14:11

'img.complete'看起來像魅力一樣工作。 – Gajus

尚未測試，但我已閱讀.complete是Firefox中的越野車，FYI – tybro0103

真的嗎？我知道firefox有不同的行爲，瀏覽器會嘗試在頁面加載之前下載所有圖像，因此圖像中的事件onload不會像應該那樣觸發，但我從來沒有聽到任何有關完整屬性的信息。你能告訴我你的來源嗎？ –

設置爲image.loaded = false，然後在您的onload回調中設置image.loaded = true並稍後檢查該屬性？

或者image.complete似乎是一個合法的屬性，如果不是W3C。

來源

2012-05-14 19:11:01 Max

假設你使用jQuery ...

image.onload = function(e) 
{     
    $(this).data({loaded: true}); 
};

後...

if($(yourImage).data('loaded')) { 
    // it's loaded! 
} else { 
    // it's not 
}

jQuery的.data()是偉大的設置特定元素的變量。

來源

2012-05-14 19:12:43 tybro0103

嗯。這不完全相同。雖然在我的具體情況下，這可能會適用。會聽到別人說什麼。 – Gajus

我同意。布魯諾科斯塔的回答看起來最好。 – tybro0103

如何檢查圖片是否加載？

回答

相關問題