javascript - 如何使用 jquery 每 x 秒显示 n 个 json 项目？

Question

我有一个 JSON 对象 items，其中有几个项目，我想每 2 秒显示其中 2 个项目。我该怎么做呢？因此，它每隔几秒就会显示 division1 中的项目，而不是一次显示所有项目。例如。每 5 秒获取所有项目，每秒显示 4 个项目，共 20 个项目。

<table id="division1" >
    <thead>
        <th>Name</th>
        <th>Score</th>
    </thead>
    <tbody></tbody>
</table>



function render_items(division){
    var tablebody ="";
        $.each(division.items, function (i,item){
            var tablerow ="<tr>"
                +"<td>"+item.name+"</td>"
                +"<td>"+item.score+"</td>"
                +"</tr>";
            tablebody = tablebody+tablerow;
            
           //$('#test').append(division.name+' '+i+' '+robot.name+'<br>');
        }
        );
        $('#'+division.name+" tbody").html(tablebody);  
}

function poll(){
    $.post("data.php", {getvalues: 0}, 
    function (data, status){
        $.each (data.divisions, function(i,division){
            render_items(division);     
            
        }); 
    },
    'json'
    );
    setTimeout('poll()',5000);
}

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

Answer 1

最简单的方法可能是隐藏所有行，然后每秒显示一系列行，如下所示:

function startShow(table) {
    var index = 0;
    var trs = table.find("tbody tr");
    function update() {
        if (index >= trs.length) {
            index = 0;
        }
        trs.hide().slice(index, index + 4).show();
        index += 4;
        setTimeout(update, 1000);
    }
    update();
}

然后用

调用它

startShow($("#division1"));