如果我在AJAX中使用.append，我如何使用.each？

I send AJAX and get HTML with many div element (.card), I use .append for add new .card elements after each AJAX request (like a infinity scroll). How can I use .each for all .card on page after one, two, three ...etc AJAX requests?

我发送AJAX并获取带有许多div元素(.card)的HTML,我使用.append在每个AJAX请求之后添加新的.card元素(如无限滚动)。如何在一,二,三......等AJAX请求之后在页面上使用.each。

$( document ).ready(function() {
$('.card').each(function(i) {
   addMarker(i);
}
});

and

$( document ).ajaxComplete(function() {
$('.card').each(function(i) {
   addMarker(i);
}
});

not working.

I get count from zero on new .card divs every AJAX request.

我从每个AJAX请求的新.card div开始计数。

2 个解决方案

#1

If you have a container <div class="container"></div> where you are appending the cards <div class="card"></div> then you should use the following script:

如果你有一个容器

,你要附加卡

,那么你应该使用以下脚本:

$(document).scroll(function(){
    $.ajax({
        method: "GET",
        url: "file.php",
        success: function(data){
            data = $.parseHTML(data);
            $.each( data, function( i, el ) {
                if (el.className == 'card') {
                    $(el).appendTo('.container');
                };
            });

            $('.card').each(function(i) {
                addMarker(i);
            });
        }
    });
});

#2

try my way, I think it will help you .

尝试我的方式,我认为它会帮助你。

$(function(){
$.ajax({
    method: "GET",
    url: "data.action",
    success: function(data){
        $(data).find(".card").each(function(i, o){
                $(".container").append(o);
        });
        $('.card').each(function(i) {
            addMarker(i);
        });
    }
  });
});

#1