jquery - 每 1 秒用 JQuery 显示一次 div

Question

我有十个带有“box”类的 div。我想一一展示。我试过这个:

$(document).ready( function() {
    $(".box").each( function() {
        $(this).fadeTo("fast", 1);
    });
});

...但是全部同时显示。我该怎么做？谢谢

Answer 1

您将需要使用fadeTo 的“duration”参数。目前，您每一项都“快速”通过。这(不一定)不是一秒，而是每个元素的相同时间量。相反，传递一个特定的时间(以毫秒为单位)并为每个元素传递不同的时间。

您可以使用传递给 each 回调函数的 index 参数来实现此目的:

$(document).ready( function() {
    $(".box").each( function(i) {
        $(this).fadeTo(1000 * i, 1);
    });
});

或者，如果您希望每个持续时间都很快，但要将它们间隔开，您可以这样做:

$(document).ready( function() {
    $(".box").each( function(i) {
        $(this).delay(1000 * i).fadeTo("fast", 1);
    });
});

此处使用delay将导致fadeTo延迟经过的毫秒数。