jQuery的加載圖像動態

我有一個img元素，每一次我動態地改變它的SRC我想獲得新的圖像的寬度（這是完全加載後）jQuery的加載圖像動態

.load（）似乎不會觸發，如果圖像是在緩存中已經（？），但我不希望在這種情況下再次加載它，如：

'image.jpg?' + new Date().getTime();

會

什麼是做到這一點的最好辦法（？）？

編輯：

$('#test img:first').load(function() { 
    console.log($(this).width()); 
});

看來它不會觸發如果在緩存中的照片已經

來源

2013-02-25 Herokiller

哪裏是你的代碼調用'.load'？ – 2013-02-25 18:22:36

您可以將.attr（'width'）鏈接到您用來更改src的任何代碼嗎？你需要發佈你的代碼，並澄清你的問題，這很混亂。 – eipark 2013-02-25 18:23:36

如果圖像在緩存中並且在某些瀏覽器（IE）的圖像上設置.src屬性之前沒有安裝onload處理程序，則不會觸發。

如果圖像是使用javascript動態創建的，那麼只需確保onload處理程序已分配，然後設置.src屬性。

如果圖像位於頁面HTML中，那麼保證您爲該特定圖像獲取onload事件的唯一方法是如果您在HTML本身中指定了onload處理程序。沒有辦法用JavaScript爲HTML中的圖像安裝onload處理程序，並確保它被調用，因爲圖像可能已在任何JavaScript運行之前加載。

您可以檢查圖像是否已經加載了.complete屬性。

所以，一個變通在你的HTML的圖像會是這樣：

var img = $('#test img:first'); 
if (!img[0].complete) { 
    img.load(function() { 
     // onload code here 
    }); 
} else { 
    // image already loaded 
}

來源

2013-02-25 18:30:54 jfriend00

在現代瀏覽器中，你可以使用complete屬性來檢查圖像已完成，即使它的緩存加載。喜歡的東西：

$("#myimg").on('load', function() { /* get new width */ }); 

if ($("#myimg").attr('src', 'image.jpg').prop('complete')) { 
    /* get new width */ 
}

（以防萬一.prop不起作用，你可以使用.get(0).complete）。

來源

2013-02-25 18:24:54

jQuery的加載圖像動態

回答

相關問題