javascript - for循环中的回调函数？

Question

如何让函数在下面的 for 循环中的所有 fadeOuts 之后运行？

我需要做的是淡出任何可能可见的东西，然后淡入特定对象。由于样式要求，我的顶部导航和下拉导航位于不同的 uls，这就是事情变得棘手的原因。

我还不太擅长编写自己的脚本，所以我(希望)缺少一些基本的东西。

我试过用函数包装东西，但这似乎会弄乱变量范围并搞砸我不明白的事情......

感谢您的帮助!

$('.ksddtop').on('mouseenter', function(){
    var ddtop = $(this).text();
    var dd = $('.' + ddtop);
    $('.ksddwrap').fadeIn();
    $(dd).fadeIn();

    var ksdds = $('.ksdd');
    for(var i = 0; i < ksdds.length; i++) {
        var ksdd = ksdds[i];
        if (! $(ksdd).hasClass(ddtop) ){
            $(ksdd).fadeOut();
        }
    }
}); 

Answer 1

如果我理解要求，应该这样做:

$('.ksdd:not(' + ddtop + ')').fadeOut().promise().done(function(){
    // all done fading!
});

淡出所有没有 ddtop 类的 ksdd 元素，然后在它们都完成动画后做一些事情。

更多信息:

在 jQuery 集合上调用 .promise 会为您提供一个 promise 对象，该对象将在元素集合上的所有动画完成时解析。这包括排队的动画。

如果您直接将回调函数传递给 .fadeOut()，您将为每个元素 获得一个回调，而不是在它们全部完成后获得一个回调。 p>