Javascript 如何使用jquery逐个显示li

我想做的是一个接一个地显示我的文本，比如标签1，标签2，标签3。。。第一次在标记1之后显示标记2，在标记3之后显示标记1，依此类推。。。一个接一个

我处理的代码如下：

HTML:

---

增加每个元件的延迟：

$('ul > li').each(function(i){
        $(this).hide().delay(i*1000).fadeIn(1850);}
  //more code
);

---

增加每个元件上的延迟：

$('ul > li').each(function(i){
        $(this).hide().delay(i*1000).fadeIn(1850);}
  //more code
);

有几件事：

• .delay（）

  仅延迟动画。它实际上并没有延迟你的代码。要么在前一个元素完成后才处理每个
  ，要么通过延长

  中较低元素的淡入时间使其看起来像这样
  \u self
  是一个全局变量（您省略了
  var
  ），因此所有回调只会使最后一个元素变为红色，因为在调用时，
  \u self
  的值就是红色的。您需要将其设置为回调函数的本地
  有几件事：
  
  
  .delay（）
  仅延迟动画。它实际上并没有延迟你的代码。要么在前一个元素完成后才处理每个
  ，要么通过延长
  中较低元素的淡入时间使其看起来像这样
  \u self
  是一个全局变量（您省略了
  var
  ），因此所有回调只会使最后一个元素变为红色，因为在调用时，
  \u self
  的值就是红色的。您需要将其设置为回调函数的本地
  另一种方法，没有莫勒博士那么好
  
  
  另一种方法，没有莫勒博士那么好
  
  
  可以使用动画回调转到下一个元素，如下所示：
  
  
  可以使用动画回调转到下一个元素，如下所示：
  
  
  我使用css
  transition delay
  属性来表示该属性，并使用scss为每个
  元素递增该属性
  
  
  为了显示
  ，我使用JS只是设置类
  show
  ，它负责不透明度的更改
  
  请参见下面编译的sass示例：
  
  
  $（'.show'）。单击（函数（）{
  $（'ul'）.toggleClass（'show'）；
  })
  li:n个孩子（1）{
  转换延迟：0s；
  }
  李：第n个孩子（2）{
  过渡延迟：0.3s；
  }
  李：第n个孩子（3）{
  过渡延迟：0.6s；
  }
  李：第n个孩子（4）{
  过渡延迟：0.9秒；
  }
  李：第n个孩子（5）{
  过渡延迟：1.2s；
  }
  李：第n个孩子（6）{
  过渡延迟：1.5s；
  }
  李：第n个孩子（7）{
  过渡延迟：1.8s；
  }
  李：第n个孩子（8）{
  过渡延迟：2.1s；
  }
  李：第n个孩子（9）{
  过渡延迟：2.4s；
  }
  李：第n个孩子（10）{
  过渡延迟：2.7s；
  }
  ul>li{
  不透明度：0；
  过渡：不透明度；
  }
  ul.show>li{
  不透明度：1；
  }
  
  显示
  
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  我使用css
  转换延迟
  属性为该元素和SCS为每个
  元素增加它
  
  
  为了显示
  ，我使用JS只是设置类
  show
  ，它负责不透明度的更改
  
  请参见下面编译的sass示例：
  
  
  $（'.show'）。单击（函数（）{
  $（'ul'）.toggleClass（'show'）；
  })
  li:n个孩子（1）{
  转换延迟：0s；
  }
  李：第n个孩子（2）{
  过渡延迟：0.3s；
  }
  李：第n个孩子（3）{
  过渡延迟：0.6s；
  }
  李：第n个孩子（4）{
  过渡延迟：0.9秒；
  }
  李：第n个孩子（5）{
  过渡延迟：1.2s；
  }
  李：第n个孩子（6）{
  过渡延迟：1.5s；
  }
  李：第n个孩子（7）{
  过渡延迟：1.8s；
  }
  李：第n个孩子（8）{
  过渡延迟：2.1s；
  }
  李：第n个孩子（9）{
  过渡延迟：2.4s；
  }
  李：第n个孩子（10）{
  过渡延迟：2.7s；
  }
  ul>li{
  不透明度：0；
  过渡：不透明度；
  }
  ul.show>li{
  不透明度：1；
  }
  
  显示
  
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  列表项
  url:'/echo/json/？？ajax调用的目的是什么？如果您只需要fadeinurl:“/echo/json/”？？ajax调用的目的是什么？如果你只需要法德林就完成了：你比我快，回答得好。谢谢！这就是我要找的！谢谢abc123，莫勒博士完成了这个：你比我快，回答得好。谢谢！这就是我要找的！谢谢abc123，莫雷法丁博士是一位animation@Dr.Molle：是的。据我所知，OP正试图将其用作
  sleep（）
  函数。fadeIn是一个animation@Dr.Molle：是的。据我所知，OP正试图将其用作
  sleep（）
  函数。
  $('ul > li').each(function(i){
          $(this).hide().delay(i*1000).fadeIn(1850);}
    //more code
  );
  
  $(document).ready(function(){
      $('li').hide();
      var shown = $('ul > li:first');
      shown.hide().delay(1000).fadeIn(1850);
      setInterval(function(){
          if(shown.next().length){
              shown = shown.next();
               shown.hide().delay(1000).fadeIn(1850);
          }
      },2000);
  });
  
      iterator( $('ul > li').hide().first() );
      function iterator( el ) {
          el.fadeIn(1850, function() { iterator( el.next() ); } )
      }
  
      $delay-increment: 0.3;
      $delay: 0-$delay-increment;
  
      @for $i from 1 through 10 { //adding transition delays to provide sequential icons show on profile load
          li:nth-child(#{$i}) {
              transition-delay: #{$delay+$delay-increment}s;
  
              &:after{
                  transition-delay: #{$delay+$delay-increment}s;
              }
          }
  
          $delay: $delay + $delay-increment;
      }