foreach循环的每次迭代之间的延迟？

所以我正在制作一个西蒙说游戏。 此function显示当前序列。 它现在的问题在于它并没有真正顺利进行，它可以同时完成所有工作。 假设颜色是“蓝色”，“红色”和“黄色，它们将同时发生而不是按顺序发生。我该如何解决这个问题？

var displaySequence = function(){ compSequence.forEach(function(color){ $("#" + color).fadeTo(300, 0.5).fadeTo(300, 1.0); }) } 

Answer 1

一个无jQuery解决方案。 您将需要使用数组索引来给出每次调用之间等待的假象，但是每个函数已经运行。 会发生什么：1秒内显示颜色1秒，2秒内显示颜色2 …

 var displaySequence = function(){ compSequence.forEach(function(color, index){ setTimeout(function(){ $("#" + color).fadeTo(300, 0.5).fadeTo(300, 1.0); }, 1000 * index); }) } 

调整1000 *索引以更改延迟。

Answer 2

我使用了jQuery 延迟函数

这是一个javascript。

 $(document).ready(function(){ var compSequence = new Array("red", "blue", "yellow"); var displaySequence = function() { $.each(compSequence, function (i, color) { // add delay $("#" + color).delay(i * 1000).fadeTo(300, 0).fadeTo(300, 1.0); }); } displaySequence(); }); 

这是一个DEMO