3

要素が作成されたときに関数のコールバックを実行できるようにしたい.load()- イメージ要素。このコードは、次のコードで新しい画像要素をロードすることで機能します。

$('<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()機能しないため、コールバック関数を使用できません。.load().load()

4

2 に答える 2

0

終了前に$('.block-wrap img').height()and$('.block-wrap img').width()が呼び出されているため、間違った画像サイズを返しています。 .load()

これらの 2 行をloadコールバック内 ( の後.replaceWith) に配置して、正しいイメージを参照できるようにします。

$('<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);
于 2011-03-24T16:48:54.083 に答える
0

私はこれについて 100% ではありませんが、load イベントを replaceWith の最後に追加できませんか? いいえ:

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

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

});
于 2011-03-24T16:27:53.533 に答える