如何迭代行，获取数据并将数据放入行而不覆盖所有行？

Question

所以我们有一个消息系统，有时会有多条消息，每条消息在发送方和接收方之间有不同的公共联系数。

如果有多条已接受的消息，目前我正在使用each查找类.outbox_accepted_row的所有行，然后使用函数获取成员ID并进行API调用获取一些我需要在这些行中显示的数据。

例如，第1行有7个常用联系人，第2行有17个。但是目前我的代码是如何编写的，最后一个数字17会覆盖所有行。

如何重写？

// This will find 2 rows on the page, grab the member id's and call
// getNameGameCounts twice:
$(".outbox_accepted_row").each( function( i, el ) {
    var elem = $( el );
    var member_id = elem.data('member-id');
    getNameGameCounts(member_id);
});


function getNameGameCounts(member_id) {
    // Here I make the api call with the id to get the counts I need:
    WHOAT.networking.getToServerWithAjax(('/api/v1/name_game/play/'+member_id), null, function (response) {

        // response comes back
        if (response) {

            // if the response has contacts
            if (response.contacts !== null || undefined) {

                // here is the problem
                // every row will get overridden with the last count :(
                $(".outbox_accepted_row .name_game p").each( function( i, el ) {
                    var elem = $(el);
                    elem.html(response.contacts.length);
                    elem.addClass('open_modal');
                });

                wireGetNameGame();
            }
        }
    });
};

Answer 1

我认为不是在第二次回调中改变dom

elem.html(response.contacts.length);

你应该在第一个循环中执行此操作

$(".outbox_accepted_row").each

getNameGameCounts应该只返回数据，而不是做另一个dom操作，它可能遇到异步问题并返回undefined，你需要像async.js一样使用。

还有一件事，你确定要循环ajax调用吗？看起来像是一个糟糕的设计。

Answer 2

不要重新选择;你之前已经拥有了这个元素。使用它来获取您实际想要更新的元素，然后在响应回调中使用它。有一个小提琴或者用于演示吗？