新しい画像がロードされたときにJavaScriptを実行する

Question

この問題についていくつかの調査をしましたが、私の状況は奇妙です。私はいくつかの画像リソースを取得するためにajaxを使用する関数を書いて、jsの変数に格納しました。 window.onload（）は最初に正常に動作しています。これは表示する前にすべてのイメージを変数にロードしますが、その後、ajaxを使用してその変数にさらに多くの画像をロードするためのリンクをクリックしました。それらが完全にその変数に格納されている場合のみです。それで私を助けてください。ありがとう、大。

Answer 1

個々の画像の読み込みはimg.onloadで追跡できます。だから、たくさんの画像をロードしていて、それらがすべてロードされたことを知りたければ、それらのすべてにonloadハンドラを置いて、それらがすべてロードされたときにカウントを累積する必要があります。

var loadCnt = 0; 
function cntLoads() { 
    ++loadCnt; 
    if (loadCnt > 20) { 
     // all images loaded now, do whatever you want to do here 
    } 

} 

var img1 = new Image(); 
img1.onload = cntLoads; 
img1.src "xxxx"; 

var img2 = new Image(); 
img2.onload = cntLoads; 
img2.src "yyyyy"; 

....