Javascript 重新加载jQueryAjax会复制JSON输出结果

摘要

我试图循环一个JSON结果，该结果由CORS AJAX调用返回。AJAX调用需要每xxx秒刷新一次，因为它是一个恒定的实时数据流

代码示例

var seconds = 2000; // time in milliseconds
var reload = function() {
$.ajax({
    type: "GET",
    url: streamUrl,
    contentType: "application/json",
    cache: false,
    success: function(data) {
         for (var i in data) {
               $("#stream").append("<div class='post'><div class='streamText'>" + data[i].keymessage + "</div>" + "<div class='streamUser'>" + data[i].username + "</div></div>")
            }
            setTimeout(function() {
                reload();
            }, seconds);
        }
    });
 };
 reload();

重新加载后的结果

Sarah: Whats up guys
Bob: Hello
Steve: Hey Bob
Bob: Hello
Steve: Hey Bob

重新加载后的结果（我需要它执行的操作。）

---

尝试以下方法：只更改一行代码，但由于您正在追加代码，它会一直追加新代码。在循环开始时，删除streamid元素的内容

这样，它将删除以前的项目，并允许您添加新项目。当再次呼叫时，它将重复自己

 success: function(data) {
                 $("#stream").html("");
                 for (var i in data) {
                       $("#stream").append("<div class='post'><div class='streamText'>" + data[i].keymessage + "</div>" + "<div class='streamUser'>" + data[i].username + "</div></div>")
                    }
                    setTimeout(function() {
                        reload();
                    }, seconds);
                }
            });

成功：函数（数据）{
$（“#流”）.html（“”）；
用于（数据中的var i）{
$（“#流”）.append（“+data[i].keymessage+++++data[i].username+”）
}
setTimeout（函数（）{
重新加载（）；
}，秒）；
}
});

Sarah: Whats up guys
Bob: Hello
Steve: Hey Bob

 success: function(data) {
                 $("#stream").html("");
                 for (var i in data) {
                       $("#stream").append("<div class='post'><div class='streamText'>" + data[i].keymessage + "</div>" + "<div class='streamUser'>" + data[i].username + "</div></div>")
                    }
                    setTimeout(function() {
                        reload();
                    }, seconds);
                }
            });