javascript - jQuery.each 中的 setTimeout 不起作用

Question

我想模仿this site的菜单项动画

这是我为制作动画编写的关键代码:

li{transition:transform 600ms}
li.animated{transform:translateY(20px)}

/* Javascript */
  $('nav ul li').each(function(i){
    setTimeout(function(){
      $('ul li').addClass('animated');
    },400*i)
  })

但是不行，在这个fiddle , 这 4 项是一起翻译的，根本没有“超时”；奇怪的是，在我的实际站点中，代码似乎更加损坏，根本没有添加该类。我检查了我网站的代码并再次摆弄，但我找不到问题出在哪里。

Answer 1

您可以使用 .each 方法的第二个参数来确定元素。喜欢:

$('.inOrder').click(function(){
  $('ul li').each(function(i, ele){
    setTimeout(function(){
      $(ele).addClass('animated');
    },400*i);
  })
})

https://jsfiddle.net/2pgf76vx/2/