0

遅延プラグインは、最初にロードされた要素に対しては正常に機能しますが、AJAX 呼び出しの完了関数にコードがあるにもかかわらず、AJAX 経由でロードされた画像に対しては機能しません。

画像を遅延読み込みするための私のコードは次のとおりです

jQuery(document).ready(function() {
    jQuery("img.lazy").lazy({
        effect: "fadeIn",
        effectTime: 1000
    });
});

これが私のAJAX呼び出しです

$(document).ready(function() {
    $('#loadmore-dj').on('click', function() {
        $('#loadmore-dj').hide();
        $('#loadmore-dj-gif').css( "display", "block");
        $.ajax({
            type: "GET",
            url: "/loadmore/dj/",
            data: {
                'slug': $('.dj_slug').text().trim(),
                'song_rank': $("#dj_song_list").find('.song_block').length
            },
        }).done(function (response) {
            $(response).appendTo($('#dj_song_list')).hide().fadeIn(1000);
            playOneAudio();
            jQuery(document).ready(function() {
                jQuery("img.lazy").lazy({
                    effect: "fadeIn",
                    effectTime: 1000
                });
            });
            $('#loadmore-dj').show();
            $('#loadmore-dj-gif').hide();
        }).done(hideLoadMore);
    });
});
4

2 に答える 2

9

問題は、デフォルトで lazy を使用する AJAX ロードでスクロール イベントが欠落していたことです。bind: "event"私のajax関数で構成パラメーターをlazyに追加すると、問題が解決しました。

jQuery("img.lazy").lazy({
    effect: "fadeIn",
    effectTime: 1000,
    bind: "event"
});
于 2014-08-14T08:38:56.560 に答える
0

が完了.lazyする前にプラグインが呼び出されます。fadeInこれを試して - 

    }).done(function (response) {
        $(response).appendTo($('#dj_song_list')).hide().fadeIn(1000, function() {
            playOneAudio();
            jQuery("img.lazy").lazy({ // don't need document.ready twice
                effect: "fadeIn",
                effectTime: 1000
            });
            $('#loadmore-dj').show();
            $('#loadmore-dj-gif').hide();
            hideLoadMore(); // don't need two .done() callbacks.
        });
    });
于 2014-08-13T20:57:33.777 に答える