Javascript 使用jQuery.append（）后刷新表

下面的代码获取一个JSON对象，然后将其内容吐出到

中。我第一次这么做的时候，我得到了我的JSON内容。但是，当我刷新时，刷新后的数据会卡在表的底部。如何刷新数据以仅显示新数据？我尝试使用

.remove（）

，但出现了明显的删除和数据刷新

    $(function() {
        $('#ReportedIssue').change(function() {
            //$('.data').remove()
            $.getJSON('/CurReport/GetUpdatedTableResults', function(json) {
                for (var i = 0; i < json.GetDocumentResults.length; i++) {
                    $('#DocumentInfoTable').append(
                        "<tr class='data'>" +
                        "<td>" + json.GetDocumentResults[i].Document.DocumentId + "</td>" +
                        "<td>" + json.GetDocumentResults[i].Document.LanguageCode + "</td>" +
                        "<td>" + json.GetDocumentResults[i].ReportedIssue + "</td>" +
                        "<td>" + json.GetDocumentResults[i].PageNumber + "</td>" +
                        "</tr>"
                    );
                };
            });
        });
    });

$（函数（）{
$（'#ReportedIssue'）。更改（函数（）{
//$（'.data'）.remove（）
$.getJSON（'/currenport/getUpdateTableResults'，函数（json）{
for（var i=0；i

谢谢,

---

Aaron

按如下方式构建HTML会更有效（当然，也会解决您遇到的问题）：

$（函数（）{
$（'#ReportedIssue'）。更改（函数（）{
//$（'.data'）.remove（）
$.getJSON（'/currenport/getUpdateTableResults'，函数（json）{
var-str=''；
for（var i=0；i

更有效的方法是构建一个代码段列表（

var str=[]；…；str.push（fragment）；

），然后执行

$（…）.html（str.join（“”））$(function() {
    $('#ReportedIssue').change(function() {
        //$('.data').remove()
        $.getJSON('/CurReport/GetUpdatedTableResults', function(json) {
            var str = '';
            for (var i = 0; i < json.GetDocumentResults.length; i++) {
                str += "<tr class='data'>" +
                    "<td>" + json.GetDocumentResults[i].Document.DocumentId + "</td>" +
                    "<td>" + json.GetDocumentResults[i].Document.LanguageCode + "</td>" +
                    "<td>" + json.GetDocumentResults[i].ReportedIssue + "</td>" +
                    "<td>" + json.GetDocumentResults[i].PageNumber + "</td>" +
                    "</tr>"
            };

            $('#DocumentInfoTable').html(str);
        });
    });
});