使用javascript的闪电效果[关闭]答案

【问题标题】：Lightening effect with javascript [closed]使用javascript的闪电效果[关闭]
【发布时间】：2025-12-15 19:00:02
【问题描述】：

我想在 JavaScript 中使用递归来产生无限循环。事实上，我希望给图像一个来来去去的效果，没完没了。

让我们先看一些代码：

function lightening(){
    $('#pic_holder').fadeOut(250).fadeIn(250);
    setTimeout('lightening', 250);
}

这个函数，正如它所写的，应该

应用fadeOut(250) 和fadeIn(250) 效果；
使用 setTimeout 函数，该函数必须递归调用 lightening 函数，此后重新应用 [fadeOut-fadeIn 效果 和 setTimeout] 块代码。

您会同意，这应该无限期地进行，但事实并非如此。

这是full test code, with HTML，您可以注意到，它只应用了一次fadeOut-fadeIn 效果。

我做错了什么？

【问题讨论】：

请注意，对“fadeOut”和“fadeIn”的调用将立即返回，即使效果需要 500 毫秒。如果您在 250 毫秒内开始下一个周期，您将积压工作。
另请注意，您问题中的代码不是递归的。异步和递归是完全不同的东西。
@FrédéricHamidi 我会说两者兼而有之。
@basilikum - 怎么样？根据wikipedia：Recursion in computer programming is exemplified when a function is defined in terms of simpler, often smaller versions of itself. The solution to the problem is then devised by combining the solutions obtained from the simpler versions of the problem.
@basilikum - 也来自*：The main disadvantage is often that the algorithm may require large amounts of memory if the depth of the recursion is very large.。这似乎暗示了一个堆栈（我在这里忽略了 TCO），每个调用都返回状态。这只是在模仿setInterval，我希望我们能同意它是不是递归。

【解决方案1】：

你真正应该做的是：

function lightening(){
  $('#pic_holder').fadeOut(250).fadeIn(250, lightening);
}

这将在淡入完成后开始下一个循环。将您自己的超时与 jQuery 动画调用隐含的超时混合起来很棘手，而且通常是不必要的。在您的情况下，您在前一个循环的中途开始了一个新循环，这实际上要等到 250 毫秒后才会生效。

【讨论】：

【解决方案2】：

setTimeout 的第一个参数可以是：

你的函数没有被调用，因为你只是在一个字符串中有它的名字。删除单引号。

function lightening(){
    $('#pic_holder').fadeOut(250).fadeIn(250);
    setTimeout(lightening, 250);
}

【讨论】：

【解决方案3】：

不要使用 2 个相互竞争的计时器，它们要么会出现间歇性错误，要么必须过于慷慨，而是使用回调：

function lightening(){
    $('#pic_holder').fadeOut(250).fadeIn(250, lightening);
}

【讨论】：

+1 用于使用回调。我删除了我的答案，因为你的答案是第一位的。以下是我在帖子中添加的注释：此解决方案允许无法保证时间的事实。计时器保证事件发生之前的最短时间，但根据处理，它可能更多。同样，您不能保证动画立即开始。这可能会让人毛骨悚然，但我认为至少值得一提并添加到答案列表中。

【解决方案4】：

删除引号。

setTimeout(lightening, 250);

【讨论】：