Question

我正在尝试使用javascript和json从app引擎数据存储区获取数据。它也允许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个元素的值三次。所以你只需要覆盖你之前给它的值。解决此问题的最简单方法是将现有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/

Answer 2

您必须在每个循环中在表中追加一个新行。这是工作小提琴。 fiddle

$.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;


        var row = '<tr><td>'+date+'</td><td>'+user+'</td><td>'+content+'</td></tr>';
        $('#valuetable').append(row);
    }
});

Answer 3

你需要做的是创建动态“tr”并附加到tbody并使用thead作为标题并使用tbody分隔正文并在每次迭代时创建tr s并在循环后将tr附加到tbody。这将完成工作，就像你现在一样，它将覆盖每次迭代的值。

Answer 4

@chamweer回答是正确的你必须用动态td创建一个新的tr

像这样：

http://jsfiddle.net/YYTkK/14/

因为你一遍又一遍地压倒同一个td。

$.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;

        // create a temporary tr
        var tr = $("<tr />");

        // append to the tr the td's with their values
        tr.append($("<td />").text(date), $("<td />").text(user), 
            $('<td />').text(content));

        // finally append the new tr to the table's tbody
        $("#js-tbody").append(tr);
}

}）;

循环javascript没有用

4 个答案: