0

そのため、ギャラリー内の各画像を調べて、php から返された別の画像と重ね合わせようとしています。すべての を収集し、それらを繰り返し処理して「保持フレーム」を作成し、それに動的画像を追加します。

どういうわけか、それらはすべて私が処理する最終的な画像に追加されています. 各画像はフレームを取得しますが、新しい画像はすべてギャラリーの最終画像にオーバーレイされます。

私は何を間違っていますか。AJAX コールバックでスコープを処理するために that=this を使用しました。

var $allPics = $(".pixelsandwich");
$allPics.each(function(){

    $(this).wrap('<div class="pixelsandwichFrame" />');
    src = $(this).attr('src');
    $that = $(this); 
    $.ajax({
        type:"POST",
        url:"js/pixelsandwich/pixelsandwich.php",
        data:{src:src},
        success:function(response){
            newImg = $("<img class='crunched'>");
            newImg.attr('src', response);
            frame = $that.parent();
            frame.append(newImg); // << these are all appending to the frame of the last image instead of each one
        }
    });
});
4

1 に答える 1

4

Your$thatはグローバル変数であるため ( がないためvar)、ループのすべてのステップでオーバーライドされます。ローカルで宣言します。

$(".pixelsandwich").each(function () {

    var $that = $(this).wrap('<div class="pixelsandwichFrame" />');

    $.ajax({
        type: "POST",
        url: "js/pixelsandwich/pixelsandwich.php",
        data: { src: $that.attr('src') },
        success: function (response) {
            var newImg = $("<img class='crunched'>").attr('src', response);
            $that.parent().append(newImg);
        }
    });
});
于 2013-02-03T01:45:37.417 に答える