Javascript 每次显示 5 项

Question

我只想连续显示 5 个项目，接下来的 5 个项目将保持不可见状态，几秒钟后可见，然后第一个项目将不可见，我如何通过 for 循环实现这一点？

var array = [" England", " USA", " Africa", " Spain", " Italy", " Norway", " Sweden", "   Denmark", " Island", " Russia"];
var maxRows = 5;
var row = array.length/maxRows;
var rows = row.toFixed();
var counter = 0;

for (var i = 0; i < rows; i++){

   for( var k = 0; k < 5; k++){
     $("#output").append(array[k]);
}
counter += 5;
$("#output").append(counter);

}

Answer 1

您可以使用递归函数为其自身设置超时:

function showCountries(start) {
    for (var i = start; i < start + 5; i++){
        if(i > array.length) return;

        $("#output").append(array[k]);
    }
    counter += 5;
    $("#output").append(counter);

    // call the function again after 2 seconds
    setTimeout(function() {
        showCountries(start + 5);
    }, 2000);
}