Question

我仍然是jQuery的初学者，我正在努力实现特定的效果。我编写了一个函数，以便在单击按钮时，有序列表的列表项会稍微延迟淡入。在第二次单击时，列表项淡出。这是代码：

$(document).ready(function(){
  var click = 0;
  var listItems = $('.list li').length;
  $('#run').click(function(){
    click++;
    console.log(listItems);
    var on = function(i){
      return(i % 2 === 0) ? true : false;
    };

  if(on(click) === false){
   $('.list li').each(function(i){
     $(this).delay(i*500).fadeIn(100);
   });
} else if (on(click) === true) {
   $('.list li').each(function(i){
     $(this).delay(i*500).fadeOut(100);
   });
  }
 });
});

列表项从第一项开始淡出，但我希望项以相反的顺序淡出。我90％肯定我需要使用.length;函数所以我已经为此分配了一个变量。

如果有人可以提供帮助，我会很感激！

Answer 1

我会使用反向for循环 - 所以不要这样：

$('.list li').each(function(i){
 $(this).delay(i*500).fadeOut(100);
});

我试试这个：

var li_items = document.getElementByClassName("list").getElementsByTagName("LI"),
    count = li_items.length,
    last_item = count - 1,
    i, t;

for(i = last_item; i > -1; i--) {
    t = li_items[i];
    $(t).delay(i*500).fadeOut(100);
}

Answer 2

要反转匹配的设置顺序，您可以use。顺便说一句，您应在每次致电delay()之前致电dequeue()：

$($('.list li').get().reverse()).each(function(i){
   $(this).dequeue().delay(i*500).fadeOut(100);
});

jQuery：fadeOut列表项的顺序相反

2 个答案: