jQuery动画回调问题答案

【问题标题】：jQuery animation callback problemjQuery动画回调问题
【发布时间】：2011-06-12 20:40:46
【问题描述】：

function thumb_wheel() {
    $("#slider .nivo-controlNav img").animate({left: '-600px'}, 14000, function(){  
        $(this).css({left:'0px'}, function(){
            thumb_wheel();
        });
    });
};

基本上，一旦动画完成，我希望它将“左”重置为 0px，然后再次调用自己。我试过用不同的方式格式化它，使用 setInterval 等...检查了 Google、Stack 和 #jQuery...无论我尝试什么，当我添加重置时，它似乎“挂起”。有什么想法吗？

【问题讨论】：

您是否尝试过删除.css() 回调并仅按顺序调用这两个函数？
好吧，我刚刚注意到我缺少一个括号，所以我添加了它，现在它回调了，但它没有运行 thumb_wheel();再次。编辑-并按顺序尝试没有用@_@虽然感谢您的帮助:)
你可以做一个while 循环。我不确定还有什么建议，因为该代码看起来不错。

标签： javascript jquery jquery-plugins nivo-slider

【解决方案1】：

您可以在这个 jsfiddle 中看到一个可行的解决方案： http://jsfiddle.net/GjemU/

您的代码中有一些语法错误，并且您尝试在 .css 上使用不存在的回调

【讨论】：

你打败了我！除此之外，您发布的代码不起作用的原因是css 没有回调。 api.jquery.com/css

【解决方案2】：

回调在不同的范围内被调用，因此this 变量指向的对象与您想象的不同。
解决方案是使用闭包：

function thumb_wheel() {
    var el = $("#slider .nivo-controlNav img");
    el.animate({left: '-600px'}, 14000, function(){  
         el.css({left:'0px'});
         thumb_wheel();
    });
};

【讨论】：

我相信this 正是他认为的那样，您的代码现在将使that 等于窗口对象。