javascript - 循环 javascript 不起作用

Question

我正在尝试使用 javascript 和 json 从应用程序引擎数据存储区获取数据。它还允许 jsonp 服务，这里是 javascript 代码:

$.getJSON("http://1.handy-post-402.appspot.com/show?callback=?", function(json) {
for (var i = 0; i < json.length; i++) {
    var map     = json[i].propertyMap;
    var content = map.isi;
    var user    = map.No_HP;
    var date    = map.tanggal;

    $('#date').text(date);
    $('#nohp').text(user);
    $('#content').text(content);
}
});

您也可以在这里查看:http://jsfiddle.net/YYTkK/7/

不幸的是，它只从数据存储中检索 1 个最新数据。我这个代码做错了什么吗？提前致谢。

Answer 1

您不是追加元素，而是简单地更改相关 3 个相同元素的值 3 次。因此，您只需覆盖之前输入的值即可。解决此问题的最简单方法是将现有的 tr 指定为 .template 并将其克隆到循环中，进行必要的更改(填充值)，然后附加它。

修复了一些其他不清楚的事情，这给出了以下内容

$.getJSON("http://1.handy-post-402.appspot.com/show?callback=?", function(records) {
    for (var i = 0; i < records.length; i++) {
        //Clone the row/unit which we will be using for each record (the class should refer to the type of item it /actually/ is)
        row = $(".row.template").clone();
        //The template class is hidden, so remove the class from the row/unit
        row.removeClass("template");

        var map     = records[i].propertyMap;
        var content = map.isi;
        var user    = map.No_HP;
        var date    = map.tanggal;

        //Make the required changes (find looks for the element inside var row)
        row.find('.date').text(date);
        row.find('.nohp').text(user);
        row.find('.content').text(content);

        //Append it to the parent element which contains the rows/units
        $("tbody").append(row);
    }
});

查看功能演示:http://jsfiddle.net/YYTkK/13/