jQuery/JavaScriptが常に実行されていません

Question

image_1とimage_2が完全に読み込まれた後にコンテンツを表示したいとします。しかし、期待どおりに動作していません。

var loading = 0; 

(function() { 
    $(".image_1").on('load', function() { 
    console.log('loading image_1'); 
    loading++; 
    checkLoading(); 
    }); 

    $(".image_2").on('load', function() { 
    console.log('loading image_2'); 
    loading++; 
    checkLoading(); 
    }); 
})(); 

function checkLoading() { 
    console.log('inside Loading check'); 
    if (loading == 2) { 
    console.log('loading done' + loading); 
    $('#loader-wrapper').fadeOut('fast').remove(); 
    } 
} 

この機能は常に動作していません。これはPHPファイルのフッタに追加されています。

場合によっては、＃loader-wrapperが正常に削除されます。しかし、これ以外のいくつかの場合、＃loader-wrapperはDOMから削除されず、その時点ではconsole.log情報が表示されません。

Answer 1

スクリプトをフッター（ドキュメントの最後）に配置したので、スクリプトが開始される前に画像が既に読み込まれていることを推測してください。したがって、私は.on("load", function(){が解雇されるとは思っていません。なぜなら、スクリプトが開始された後にロードイベントが発生しないからです。

彼ら（jsfiddle）も、画像の後にスクリプトを読み込むように私は、ここで少しデモフィドルを作った：this is the fiddle

は（前に）早くあなたの関数を呼び出して画像を試してみて、これが解決しないかどうかを確認あなたの問題。