爲什麼我沒有得到一個onload處理程序？

我有幾個圖像我想加載。每個人都連接到一個處理程序，用於檢查是否顯示所有圖像，如果是，則將其顯示在畫布上。爲什麼我沒有得到一個onload處理程序？

的處理器，目前正與在頂部的console.log（），是：

POCKETWATCH.check_draw_clock = function() 
    { 
    console.log("check_draw_clock"); 
    POCKETWATCH.images_loaded_count += 1; 
    if (POCKETWATCH.images_loaded_count == 
     POCKETWATCH.total_images_available * 2) 
     { 
     POCKETWATCH.draw_clock(); 
     } 
    }

我開始加載圖像：

console.log('Starting images.'); 
POCKETWATCH.clock_face = new Image(); 
POCKETWATCH.clock_face.onload = POCKETWATCH.check_draw_clock; 
POCKETWATCH.clock_face.src = 'img/transparent-clock.png'; 
POCKETWATCH.hour_hand = new Image(); 
POCKETWATCH.hour_hand.onload = POCKETWATCH.check_draw_clock; 
POCKETWATCH.hour_hand.src = 'img/hour-hand.png'; 
POCKETWATCH.minute_hand = new Image(); 
POCKETWATCH.minute_hand.onload = POCKETWATCH.check_draw_clock; 
POCKETWATCH.minute_hand.src = 'img/minute-hand.png'; 
POCKETWATCH.second_hand = new Image(); 
POCKETWATCH.second_hand.onload = POCKETWATCH.check_draw_clock; 
POCKETWATCH.second_hand.src = 'img/second-hand.png'; 
POCKETWATCH.dial_hand = new Image(); 
POCKETWATCH.dial_hand.onload = POCKETWATCH.check_draw_clock; 
POCKETWATCH.dial_hand.src = 'img/dial-hand.png'; 
console.log('Images all started.');

控制檯後，這沒有任何錯誤，只是「啓動圖像」。和「圖像全部開始」，沒有「check_draw_clock」，沒有錯誤。從我的另一個項目中複製圖像，並據我所知，有適當的文件系統權限等，圖像都在那裏。

我如何得到圖像被加載時沒有引用回調函數和沒有報告錯誤？

--UPDATE--

針對第一個答案，我評論了我現有的代碼，並添加了突變爲：

['img/transparent-clock.png','img/hour-hand.png','img/second-hand.png','img/dial-hand.png'].forEach(function(src) 
    { 
    var img = new Image(); 
    // img.onload = POCKETWATCH.check_draw_clock; 
    img.onerror = function(){ console.log("error"); }; 
    img.src = src; 
    if (img.complete) { POCKETWATCH.check_draw_clock(); } 
    console.log(POCKETWATCH.check_draw_clock); 
    POCKETWATCH.check_draw_clock(); 
    });

這是不打算作爲一個解決方案，但用於診斷目的。最後一行代碼得到了一個錯誤記錄，POCKETWATCH.check_draw_clock「不是函數」，然後當我記錄POCKETWATCH.check_draw_clock時，它記錄了「未定義」。

我檢查了我的代碼，看看我是否重新定義了POCKETWATCH;在與應用程序關聯的整個代碼中，唯一定義POCKETWATCH的時間位於引用代碼的上方，它被設置爲{}。 check_draw_clock（）也只定義一次。

FWIW。看到

來源

2015-12-11 JonathanHayward

'POCKETWATCH.clock_face.onerror = function（）{alert（「HERE」）; };'這是否會引發火災？ – epascarello

@epascarello，連接錯誤處理程序時沒有任何內容。我讀到的另一個問題是，你不能指望一個負載事件觸發;我正在考慮簡單地不等待一切加載。 – JonathanHayward

它沒有任何意義。你正在測試哪個瀏覽器？此外，您是否嘗試過私密/隱身模式？你可以在http://jsfiddle.net/上提供我們的工作代碼嗎？ – Piyin

檢查圖像與完整

緩存

['img/transparent-clock.png','img/hour-hand.png','img/second-hand.png','img/dial-hand.png'].forEach(function(src){ 
    var img = new Image(); 
    img.onload = POCKETWATCH.check_draw_clock; 
    img.onerror = function(){ console.log("error"); }; 
    img.src = src; 
    if (img.complete) { POCKETWATCH.check_draw_clock(); } 
});

來源

2015-12-11 19:59:33 epascarello

打穿CONSOLE.LOG check_draw_clock（）一路，發現懷錶的定義是什麼後，我引用，而不是之前。現在日誌記錄很有意義。

來源

2015-12-11 21:32:08 JonathanHayward

爲什麼我沒有得到一個onload處理程序？

回答

相關問題