javascript - 类(class)的淡入循环

Question

我试图在 javascript 中循环遍历类的每个元素，并在暂停一定秒数后显示它。我已经掌握了逻辑，但由于 jQuery 正在调用该类，而不是 this 的唯一实例，因此它会同时显示所有内容:

jQuery( document ).ready(function ($) {
    $( ".fadein" ).hide();

    $( ".fadein" ).each(function (index) {
      $( "." + this.className ).delay(index * 800).fadeIn( "slow" );
    });
});

Answer 1

each 循环已设计为一次向您传递一个元素。目标元素作为“this”传递，因此只需淡入“循环”中的当前元素即可，而不是每次都获取所有元素。

// Replace this
$( "." + this.className ).delay(index * 800).fadeIn( "slow" );
// with this
$( this ).delay(index * 800).fadeIn( "slow" );

// result:
$( ".fadein" ).each(function (index) {
    $( this ).delay(index * 800).fadeIn( "slow" );
});