jQuery custom order for .each()
我成功地使用.each()在某些块中一个接一个地淡入淡出。如预期的那样,它从第一个元素开始,然后按顺序移动到下一个元素。
有什么方法可以控制.each()的顺序吗?我想要的不是1,2,3,4等等,例如1,2,5,9,6,3,4,7,8。
1 2 3 4 5 | $(window).load(function() { $(".blocks").each(function(i) { $(this).delay((i + 1) * 500).fadeIn(500); }); }); |
在直接回答您的问题时,
由于您没有透露如何通过算法确定所需的订单,因此您可以选择以下选项:
在非常特殊的代码片段实例中,您可以通过创建查找表来查找给定数组索引的所需延迟值的方式,而不必对
1 2 3 4 5 6 7 | $(window).load(function() { var delayLookup = {1:1,2:2,5:3,9:4,6:5,3:6,4:7,7:8,8:9}; $(".blocks").each(function(i) { var delayTime = delayLookup[i] || i; $(this).delay(delayTime * 500).fadeIn(500); }); }); |
您不会说订单的逻辑是什么。如果您是随机的,则可以执行以下操作:
1 2 3 4 5 | $('.blocks') .sort(function(item) { return Math.floor(Math.random() * 2) === 1; }) .each(function(i) { $(this).delay((i + 1) * 500).fadeIn(500); }); |
您首先必须按照想要的方式对数组进行排序,这似乎是一个随机的排序,因此您必须手动创建一个数组并填充元素。然后可以调用每个函数。