ロード関数jQueryのコールバック

Question

要素が作成されたときに、画像要素である​​関数のコールバックを実行したいと考えています。コードは、次のコードで新しい画像要素を読み込むことで動作します。

$('<img />').load(function() 
{ 
    var img = this; 
    $('.block-wrap img').fadeOut('slow', function() 
    { 
     $(this).replaceWith(img); 
    }); 
}).attr('src', loadurl); 

しかし、画像が読み込まれて置き換えられたときに続行したいと考えています。これは、私はそれを動作させる必要がある方法です：

$('<img />').load(function() 
{ 
    var img = this; 
    $('.block-wrap img').fadeOut('slow', function() 
    { 
     $(this).replaceWith(img); 
    }); 
}).attr('src', loadurl); 

$('.block-wrap input.imageheight').val($('.block-wrap img').height()); 
$('.block-wrap input.imagewidth').val($('.block-wrap img').width()); 

それは最初の画像の高さ（負荷スピナー画像で置き換えられていない画像）を返しますので、私は画像の高さを取得できるようにする必要がありますDOMに完全にロードされたときの幅を示します。あまりにも悪い.replaceWith()コールバックメソッドがありませんが、私は​​関数を渡された関数のために動作しないので、​​でコールバック関数を使用することはできません。

Answer 1

これは100％ではありませんが、replaceWithの最後にロードイベントを追加できませんか？すなわち：

 
$(this).replaceWith(img).load(function(){ 

    $('.block-wrap input.imageheight').val($('.block-wrap img').height()); 
    $('.block-wrap input.imagewidth').val($('.block-wrap img').width()); 

}); 

Answer 2

$('.block-wrap img').height()と$('.block-wrap img').width()が​​前仕上げと呼ばれているので、間違ったイメージのサイズを返します。

loadコールバック（.replaceWithの後）に2つの行を挿入して、正しいイメージを参照できるようにします。

$('<img />').load(function() 
{ 
    var img = this; 
    $('.block-wrap img').fadeOut('slow', function() 
    { 
     $(this).replaceWith(img); 
     $('.block-wrap input.imageheight').val($('.block-wrap img').height()); 
     $('.block-wrap input.imagewidth').val($('.block-wrap img').width()); 
    }); 
}).attr('src', loadurl);