画像の読み込みが完了した時点を確認するにはどうすればよいですか？

Question

私はランダムに画像を読み込むPHPコードのブロックを持っています。私はそれがいくつかの追加アクションを実行できるように、画像がロードされたときを判断しようとしています。現在画像をロードする方法は次のとおりです。

// Gets my image 
$sql = "SELECT id FROM images WHERE user_id=$owner_user_id LIMIT 0,1"; 
$imgres = mysql_query($sql); 
if ($imgres) { 
    $imgrow = mysql_fetch_array($imgres, MYSQL_ASSOC); 
    if (!empty($imgrow)) { 
     echo ('<image src="img.php?id=' . $imgrow['id'] . '" id="profile_img" style="visibility:hidden"/>'); 
    } 
} 

私がする必要がある操作の1つは、画像の幅を取得することです。イメージを次のようにしています：

alert("IMAGE WIDTH:"+$('#profile_img').width()); 

イメージがロードされる前に呼び出されているため、現在は0が返されています。このメソッド呼び出しをdocument.readyブロックに追加しようとしましたが、画像がロードされる前に呼び出されます。画像がロードされたときを簡単に判断する方法はありますか？これは本当に何もしてい

http://api.jquery.com/load-event/

Answer 1

$("#profile_img").load(function(){ 
    alert(("IMAGE WIDTH:"+$('#profile_img').width()) 
}); 

http://api.jquery.com/load-event/

Answer 2

$(document).ready(function(){ 
    $('#img_id').load(function() { 
     alert('image is loaded'); 
     }); 
}); 

これはあなたがjQueryを使って、あなたのイメージにloadイベントハンドラをバインドでき

Answer 3

トリックを行いますPHPと関係があります。イメージの読み込みはクライアント側で行われるため、JavaScriptを使用する必要があります。あなたはJavascriptのイベントに対処することがあります - ここでプライマーです：幸いにも

http://www.quirksmode.org/js/introevents.html

、jQueryのは、あなたが渡すことができます（！でもload()と呼ばれる）あなたのためのイベントに結合する組み込み関数を持っていますそのコンテンツが読み込まれると呼び出されるコールバック。

Answer 4

：

Answer 5

あなたの最善の策は、事前にすべてのDOMの読み込みにJavaScriptで画像をプリロードすることです。

<SCRIPT language="JavaScript"> 
    preload_image = new Image(25,25); 
    preload_image.src="http://mydomain.com/image.gif"; 
</SCRIPT> 

はイメージがロードされたときにテストするためのjQuery​​を使用しないでください。画像SRCが同じSRCに設定されている場合は、WebKitの中で正しく発生しません。•確実にクロスブラウザ

それは一貫して動作しない•

も[それは]：jQuery docsによると、

前に•それないDOMツリーない正しくバブルアップ

•すでにブラウザのキャッシュに住んでいるイメージに起動するように中止することができる