Javascript jQuery动画循环

我对动画循环有问题。有一个对象我想以一种特殊的方式移动，并在循环中完成它。有没有本地的选择？我有这个：

$(function () {
    function runIt() {
        $('#div').show("slow");
        $('#div').animate({"marginLeft":"300px"},8000);
        $('#div').animate({"marginLeft":"0px"},8000);
        $('#div').hide("slow", runIt);
    }
    runIt();
});

---

但它似乎不那么漂亮。

我就是这么做的。我唯一的建议是为更好的代码使用链接，这样jquery对象就不会每次都被创建

$(function () {
   function runIt() {
      $('#div').show("slow")
               .animate({"marginLeft":"300px"},8000)
               .animate({"marginLeft":"0px"},8000)
               .hide("slow", runIt);
   }

   runIt();
});

---

这是对动画进行排队的正确方法。但是，可以对代码进行一些修改，使其更简洁、更美观：

• 在局部变量中存储对所选元素的引用，以加快执行速度（减少对DOM的查询）
• 通过删除对象属性不必要的引号来清理它
• 每个默认值的大小以像素为单位，因此我们可以使用纯整数
• 命名函数可以替换为立即调用的匿名函数，然后使用

  arguments.callee

  作为回调

下面的示例展示了上述更改：

$(function () {
    var element = $("#div");
    (function(){
        element
            .show("slow")
            .animate({ marginLeft: 300 }, 1000)
            .animate({ marginLeft: 0 },   1000)
            .hide("slow", arguments.callee);
    }());
});

您还可以通过创建自己的插件来使用自定义队列，从而以更高级的方式完成此任务。我创造了一段时间前，当我是无所事事的动画队列

---

有关立即调用函数表达式的更多信息，请继续阅读。

谢谢您的建议。但是，有没有其他方法可以在不使用回调黑客的情况下让同样的事情变得更漂亮呢？糟透了！我们有同样的想法；）这不是黑客，在我看来这是最好的方法。动画完成后，可以再次启动它。我唯一能想到的另一种方法是setTimeout或setInterval，但那要难看得多。您必须计算动画运行的时间，并将超时设置为。。。丑陋，谢谢，这就是我想知道的。我想jquery对于循环动画可能有一些特殊的功能，但这个选项对我来说很好。@AlexFord不，不会的。这不是真正的递归。调用

runIt

完成。对

runIt

的下一个调用被调用为对

hide

的回调，此时第一个

runIt

已完成并脱离堆栈。我觉得很不错。kingjiv对缩进的回答让它看起来更好。kingjiv的解决方案看起来很可能是一个候选方案，我唯一要补充的是考虑动画函数中允许的“onComplete”函数。查看jQuery Api文档了解更多信息！我在我的答案中添加了一个链接，我使用了一个小插件和自定义队列。希望有帮助！：）在更一般的情况下，可以调用arguments.callee（）；作为单独一行