Question

我是js和jquery的新手，我创建了一个json对象，以通过外部json在表中显示数据。但是我想在json文件中添加数据，该数据会在表中自动更新。

$(window).load(function(){      
    $(document).ready(function () {

        var url='json/data.json';
        $.getJSON(url, function (r) {

            for (var i = 0; i < r.length; i++) {
                var tr = $('<tr>');

                tr.append("<td>" + r[i].User_Name + "</td>");
                tr.append("<td>" + r[i].score + "</td>");
                tr.append("<td>" + r[i].team + "</td>");
                $('tbody').append(tr);
            } 

        }); 

    });
});

 <table id="racer_details">
    <tbody>
    </tbody>
</table>

我的json数据是

[
    {
        "User_Name":"John Doe",
        "score":"10",
        "team":"1"
    },
    {
        "User_Name":"Jane Smith",
        "score":"15",
        "team":"2"
    },
    {
        "User_Name":"Chuck Berry",
        "score":"12",
        "team":"2"
    }
]

这是我的示例数据，首先我将3个值添加到表中，但是我想随时间延迟将值更新到表中，如果我想在json中添加一些值，它将在时间后自动更新表中的值延迟。带有ajax的jquery怎么可能。

Answer 1

HTML：

   <table id="racer_details">
    <tbody id="racer_data">
    </tbody>
   </table>

JS：您可以使用ajax显示此类数据，

$(window).load(function(){      
    $(document).ready(function () {
        $.ajax({
           type:"GET",
           url:"xyz",
           data:{ 'xyz': xyz },
           contentType:"application/json; charset=utf-8",
           dataType:"json",
           success:function (result){
              var dataTab = $.parseJSON(JSON.stringify(result));
              $.each(dataTab.data, function (index, value) {
                    $("#racer_data").append('<tr>'+value.name+'</tr>
                                 <tr>'+value.scor+'</tr>
                                 <tr>'+value.team+'</tr>'
              },
             error: function(){},
          });

    });
});

javascript-如何在jQuery中通过Ajax将json对象添加到表中并具有时间延迟？

1 个答案: