JQuery 延迟（）函数打破循环？答案

【问题标题】：JQuery delay()-function breaks loop?JQuery 延迟（）函数打破循环？
【发布时间】：2010-04-24 18:54:27
【问题描述】：

我正在尝试淡入和淡出一个元素，但是中间有一点暂停，它可以在没有暂停的情况下工作，但是当我使用 jQuery delay() 函数添加暂停时，它只是在第一个之后停止淡出();

代码如下：

$('#headerimage2').each(function(){
for(i=1;i<50;i++){
    $(this).fadeOut(1200).delay(1000).fadeIn(1000).delay(1000);
    }
});

为什么 delay() 函数（第一个和第二个）会中断循环？

【问题讨论】：

标签： jquery delay fadein fadeout

【解决方案1】：

这里是在黑暗中拍摄的，但您确定您使用的是 1.4 版的库。这是该版本的新功能。

【讨论】：

我同意@BradBrening，也许你没有使用 jquery 1.4
好的，我刚看到。 Drupal 6.16 仍然有 1.3.2，虽然更新模块已经处于 alpha 状态。我也可以用 setTimeOut 来做吗？或者只是自己将整个新的 Jquery 库粘贴到 drupal 文件中？
我对 Drupal 不熟悉，但是如果你被 jQuery 库的 1.3.2 卡住了，你可以使用 fadeOut 函数的回调参数来定义一个函数，然后调用 setTimeOut fadeIn 作为它的回调。有点一连串的事件，但它应该有效。

【解决方案2】：

您发布的代码在最新的 jquery 中完美地在 Firefox、Safari 和 chrome 中运行：

<!DOCTYPE html>
<html>
<head>
  <style>
div { width: 60px; height: 60px; float: left; }
.first { background-color: #3f3; }
</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>

<p><button>Run</button></p>
<div id='headerimage2' class="first"></div>
<script>
    $("button").click(function() {
    $('#headerimage2').each(function(){
    for(i=1;i<5;i++){
        $(this).fadeOut(100).delay(500).fadeIn(100).delay(500);
       }
    });
    });
</script>
</body>
</html>

【讨论】：