圖像載入未正確執行？

我想設置一個調整我的圖像的onloads函數，以便如果圖像大於用戶的瀏覽器窗口，它調整自己。當我把這樣的功能：圖像載入未正確執行？

function resize(){ 
    console.log(this.width); 
}

它說0或NaN或undefined。如果我稍後在圖像上運行該函數，我會得到正確的結果...我如何設置一個可以訪問高度和寬度屬性的onload？

編輯：對不起，這樣的困惑：http://jsfiddle.net/9aDFe/

的圖像正在搜索「風景」

來源

2011-12-08 mowwwalker

你能在[jsfiddle]（http://jsfiddle.net/）中重現這個嗎？它適用於我：http://jsfiddle.net/EtzHT/ – gilly3

你的jsFiddle不會顯示你的描述 –

@Chris，這真的很奇怪的錯誤。當我加載頁面時不會發生，但是當我在jsfiddle上運行時它不會發生。任何人都知道這是爲什麼發生？ – mowwwalker

跨瀏覽器解決方案是使用readystatechange和負載的組合

var image = new Image(); 
image.addEventListener ("readystatechange", yourImageOnloadChecker); 
image.addEventListener ("load", yourImageOnloadChecker); 
image.src = "path/to/your/image"; // set SRC after your events. it's an IE fix

你的圖像的onload檢驗器功能應該檢查isNaN或等於0的高度/寬度，如果是，設置了一個回調以setTimeout自身。

來源

2011-12-09 00:05:37 Matthew

編輯這個答案被加入後的問題細節作出無效在谷歌上發現的我回答了。我將在此留作參考（因爲這確實解決了一個有效且可能發生的問題），但請注意，這不是OP描述的特定問題的解決方案。

如果您正在使用提供「domReady」事件的庫（甚至在某些情況下，如果腳本位於頁面底部），則onload函數未附加到圖像上及時 - 它已經加載。特別是如果您使用的是body.onload事件 - 在圖像完全加載之前不會觸發。

如果您想以這種方式處理圖像（通過代碼body.onload執行），那麼您可以直接訪問圖像 - 它已經加載。動態放置在頁面上的後續圖像將按照您的預期觸發onload事件，因爲它們是在事實之後添加的。

查看https://developer.mozilla.org/en/DOM/window.onload以獲取關於該事件的更多討論，並提出了在裝載過程中不同時間點火的替代方案。

來源

2011-12-08 23:13:28

但它確實運行 - 「它說0或NaN或未定義」。如果它沒有運行，它將如何登錄到控制檯？我不認爲這是問題。（不是我downvote，順便說一句） – gilly3

是的。添加的OP的jsFiddle也不會爲我顯示錯誤。 –

圖像載入未正確執行？

回答

相關問題