jQuery用新数据替换表行

我试图用通过ajax获得的新数据替换表。第一次可以很好地工作，但是随后添加了行而不是替换行，因此我最终得到了重复的行

以下是我的一些代码：

            success: function(data){            
            $("#featured_listing_tbody").children( 'tr:not(:first)' ).remove();
            counter= 1;
            $.each(data, function(i, val){  
                        newPropertyRows += '<tr>';
                                $.each(val, function(key, info){
                                    var skip = false;
                                        if(key == "Id") {                                           
                                                Id =  info;
                                                newPropertyRows += '';
                                                skip = true;
                                        }
                                        if(key == "thumbs"){
                                                info = '<img width="100px" src=uploads/properties/'+Id+'/thumbs/'+info+' />';
                                                newPropertyRows += '<td class="col'+counter+'"><a href="/featured.php?prop='+Id+'">'+info+'</a></td>';  
                                                skip = true;
                                                counter++;      
                                        }
                                        if(skip == false){
                                                newPropertyRows += '<td class="col'+counter+'"><a href="/featured.php?prop='+Id+'">'+info+'</a></td>';                      
                                                counter++;      
                                        }

                                        info = '';
                                });                     
                        newPropertyRows += '</tr>';                         
            });                     
                $("#featured_listing_tbody").html(newPropertyRows);
        }

成功：函数（数据）{
$（“#特色列表体”）。子项（'tr:not（：first'）。删除（）；
计数器=1；
$.each（数据，函数（i，val）{
newPropertyRows+=''；
$。每个（val、功能（键、信息）{
var skip=false；
如果（键==“Id”）{
Id=信息；
newPropertyRows+=''；
跳过=真；
}
如果（键==“拇指”）{
信息=''；
newPropertyRows+=''；
跳过=真；
计数器++；
}
如果（跳过==false）{
newPropertyRows+=''；
计数器++；
}
信息=''；
});                     
newPropertyRows+=''；
});                     
$（“#特色清单_tbody”）.html（newPropertyRows）；
}

不太确定是存储表的记录，还是它是实时的，并且没有存储在任何地方

---

但是如果存储了，您可以尝试为整个表或服务器端的行生成html，然后用从服务器接收的数据替换容器/表内容。

我有一个建议，而不是返回数据对象并将其转换为javascript中的html，只需将数据作为所需的表行返回即可。因为您已经为页面生成了它们，所以您应该有逻辑/模板来轻松地再次生成它们

要替换数据，我只需在数据行周围添加一个

标记，并在ajax成功函数中替换其内容，而不是使用复杂的选择器来忽略第一个表行，我假定这是列标题

$("#featured_listing tbody").html(data); //Replace contents of <tbody> tag

$（“#特色#清单体”）.html（数据）//替换标签的内容

下表：

<table>
    <thead><tr>....row headers...</tr></thead>
    <tbody>...data rows...</tbody>
</table>

…行标题。。。
…数据行。。。

问题可能不在您发布的代码部分。例如，在当前代码中，始终对

newPropertyRows

变量使用

+=

操作是否在每次ajax调用之前将其重置为空字符串

---

顺便说一句，在我看来，您似乎没有调用

$（“#特色列表体”）.children（'tr:not（：first'））.remove（）

在

success

处理程序的开头，因为您使用

$（“#特色列表体”）.html（newPropertyRows）稍后将覆盖整个表格。
好的，我理解一个类似的想法。但是，随着时间的推移，结果会越来越大，我担心额外的数据会减慢这个过程。我疯了吗（别笑了）下载几行表并把它们吐出来要比在数据中循环并动态创建它们快得多，尤其是那些计数器之类的东西。这样，负载就在您的服务器上，而不是用户（可能是石器时代）浏览器上。