Question

我正在从服务器请求数据，如果我发布新数据，我希望浏览器显示旧数据+加上新数据，但这是我得到的：

$(document).ready(function() {
  loadpost()
});

function loadpost() {
    $.ajax({
        url: '/home/_loading_process/',
        dataType: 'json',
        type: 'GET'
      })
      .done(function(data) {
          var dataArray = [];

          $.each(data.posts, function(i) {
            dataArray.push(data.posts[i].comment);
          });

          console.log(dataArray);
          $.each(dataArray, function(i) {
              $('div').clone.appendTo('anotherdiv');
            }
          });
      };

// output
// [1]
// [1, 2]
// [1, 2, 3]

我怎样才能让它只显示更新的列表而不显示旧的并同时更新如下：

// output
// [1]

发布新数据后：

// [1, 2]

不

// [1]
// [1, 2]

Answer 1

您每次拨打dataArray时都会创建新的loadPost。在dataArray函数之外定义loadPost。在每次调用时将dataArray传递给loadPost，或者将dataArray全局定义为.push()新元素到同一数组。

$(document).ready(function(){
    const dataArray = [];
    loadpost(dataArray); 
    // at next call to `loadPost` pass same array: `dataArray`    
});

function loadpost(arr) {    
    $.ajax({    
        url: '/home/_loading_process/',
        dataType: 'json',
        type: 'GET'    
    })
    .done(function(data){   
        $.each(data.posts, function(i){   
            arr.push(data.posts[i].comment);   
        });    
        console.log(arr);   
    });    
};

$(document).ready(function(){
    loadpost()    
});

const dataArray = [];

function loadpost() {    
    $.ajax({    
        url: '/home/_loading_process/',
        dataType: 'json',
        type: 'GET'    
    })
    .done(function(data){   
        $.each(data.posts, function(i){   
            dataArray.push(data.posts[i].comment);   
        });    
        console.log(dataArray);   
    });    
};

Answer 2

正如JJJ所说，你无法改变控制台输出，但如果你真的想要存储更新的列表，你应该从服务器端进行，如果你不能改变代码，你可以存储对象然后迭代并更新数组。

$.ajax({
    url: 'yourURL',
    method: 'yourMethod',
    dataType: 'yourDataType',
    success: function(data){
        dataArray = [];
        $.each(data.posts, function(index){
                dataArray.push(this.comment);
        });
        /* Iterate in the dataArray and append the elements in
        *   HTML nodes
        */
    }
});

获取刚刚更新的列表

2 个答案: