0

これは子供の遊びのように見えるかもしれませんが、画像のsrc属性を置き換える方法がわかりません。

srcは画像を生成する「build.php」です。「ミックス」をクリックすると、build.phpが実行されて新しい画像が生成され、古い画像が削除され、新しい画像が適切なフェードアウト/フェードインで表示されます。

また、新しい画像の読み込みが完了すると非表示になる「新しい画像の作成」もあります。

で試してみました

$("#mix").click(function(){
   var img = new Image();
      $(img).load(function () {
         $(this).hide();
         $('#loader').removeClass('loading').append(this);
         $(this).fadeIn();
   }).attr('src', 'build.php');
});

しかし、2回目に「ミックス」をクリックすると、古い画像が削除されるのではなく、古い画像の下に新しい画像が配置されます。

4

2 に答える 2

1
$("#mix").click(function(){
       var img = new Image();
          $(img).load(function () {
             $(this).hide();
             $('#loader').removeClass('loading').append(this);
             $(this).fadeIn();
       }).attr('src','').attr('src', 'build.php');
    });

以下を見てください - 作品:

$(document).ready(function() {
$("#yourimagediv").click(function() {
$("#yourimagediv").attr("src","image.php?"+new Date().getTime());
});
});​
<img id="yourimagediv" src="image.php" />
于 2012-09-18T12:07:13.457 に答える
1
var mix = $('#mix'),
    jqImage = $('#brick-image');

mix.on('click', function (e) {
    var img = new Image();
    jqImage.fadeOut();
    img.onload = function () {
      jqImage.attr('src', img.src);
      jqImage.fadeIn();
    };
    // add param to prevent caching of build.php image
    img.src = 'build.php?' + new Date().getTime();
    e.preventDefault();
});
于 2012-09-18T12:16:01.830 に答える