1

現在、別の html5/javascript 広告を作成しています。これは、Cookie からの複数のデータを使用します。すべてを適切にレンダリングするために、情報を取得してから別の関数に送信する for ループを作成しました。

私の問題は、最初の読み込みが速すぎるため、画像がスキップされることです。適切に表示される前に、毎回広告を更新する必要があります。これまでに使用した onload 関数はすべて失敗しました (間違ったデータを送信するか、何も送信しないか、その一部のみを送信します)。

プロジェクトの関連部分は次のとおりです。

for (var i=0; i < 3; i++){
   pT.push("pT"+[i]);
   pM.push("pM"+[i]);
   ctx.push("ctxP"+[i]);
   cvs.push("cvsP"+[i]);

   cvs[i] = document.getElementById('canvas'+[i]);
   ctx[i] = cvs[i].getContext('2d');

   pT[i] =  new Image();
   pT[i].onload = function(){
       console.log("pT: "+ this.height);
   }
   pT[i].src = data.products[i].imageUrl;

   pM[i] =  new Image();
   pM[i].onload = function(){
       console.log("pM: "+ this.height);
   }
   pM[i].src = data.products[i].imageUrl;

   testing(pT[i], pM[i]);
}

function testing(pThumb, pMain){
   console.log(pThumb.height);
}

私が欲しいのは、すべての読み込みが完了したときにすべての情報が送信されるようにする方法です。

4

1 に答える 1

0
pT[i].onload = function() { 
    alert("Image is Loaded, do you thing on the image here");
}



otherFunction(pT,pM);
function otherFunction(pT,pM) {
    console.log(pT,pM);
}




pT[i] =  new Image();
pT[i].onload = function(){
   pM[i] =  new Image();
   pM[i].onload = function(){
       console.log("pM: "+ this.height);
       testing(pT[i], pM[i]);
   }
} 
pT[i].src = data.products[i].imageUrl;
pM[i].src = data.products[i].imageUrl; // this is very ugly but you'll be sure to call your function when both image are ready. Since i'm not the best with Canvas, I will accept any edit for a better code.
于 2012-10-03T13:16:29.550 に答える