jQuery - 背景を変更する前に画像を読み込むのを待ちます。

Question

類似の機能の例はたくさんありますが、私にとってはうまくいかないものがあります。私が現在持っていることは、私は背景色が変更される前に/ショーをロードするために、画像を期待

<img id="sample_image" src="sample_image.png" alt=""> 
<script> 
$('#sample_image').on('load',function(){ 
    $("#sample_image").css("background", "#ff0000"); 
}); 
</script> 

ですが、何が起こるかは、イメージがロードされる前に、あなたが赤の背景を参照してくださいです。

<img id="sample_image" src="" alt=""> 
<script> 
$('#sample_image').attr("src", "sample_image.png").on('load',function(){ 
    $("#sample_image").css("background", "<%=strRGB%>"); 
}); 
</script> 

私はjQueryのを使用して、SRCを設定しようとした

が...しかし、これは同じことをやりました。

私は間違っていますか？私はあなたはそれが要素やイメージのためだかどうかのために使用しているload方法についてはよく分からない

おかげ

Answer 1

。

あなたはImageオブジェクトを作成し、オンロード用のドキュメントで

var img = new Image(); 
img.onload = function(){ 
    //change the attr here 
} 

Answer 2

を確認することができます（https://api.jquery.com/load-event/）彼らが得た：

<img src="book.png" alt="Book" id="book"> 
... 
$("#book").load(function() { 
    // Handler for .load() called. 
}); 

そして必ず、あなたはバニラを使用することができます。

var img = new Image() 
img.src = "book.png"; 
img.onload = function(){ ... };