1

我制作了一个回调函数，该函数旨在在之后启动

$('.menuIco').not($(this)).fadeOut()

但是我有 9 个回调而不是 1 个回调（可能是因为 10-1=9 个元素not($(this))）。

为什么？以及如何预防？

我正在使用带有变量的解决方法，但在我看来它并不太专业。

var loaded = false;

$('.menuIco').not($(this)).fadeOut(function() { // hide all icons but one
    if(loaded==false) {
        loaded = true;

        $('.menuIco p').addClass("icoCaptionOff");
        $(menuIco).animate({top: "20", left: "-100"}, "fast", function() {
            LoadContent($(menuIco).attr('id'));

        });
    }
});
4

4 回答 4

3

您可以使用.promise()在所有元素的动画完成后执行回调

.promise() 方法返回一个动态生成的 Promise，一旦绑定到集合的特定类型的所有操作（无论是否排队）都结束，该 Promise 就会被解析。

默认情况下，type 为“fx”，这意味着返回的 Promise 在所选元素的所有动画都完成后解析。

$('.menuIco').not(this).fadeOut().promise().done(function () {
    $('.menuIco p').addClass("icoCaptionOff");
    $(menuIco).animate({
        top: "20",
        left: "-100"
    }, "fast", function () {
        LoadContent($(menuIco).attr('id'));

    });
});
于 2013-09-05T11:11:26.593 回答
1

当另一个函数完成时，您可以使用when和then延迟处理程序来执行一个函数：

提供一种基于一个或多个对象（通常是表示异步事件的延迟对象）执行回调函数的方法。

文档：http ://api.jquery.com/jQuery.when/

代码：

$('.menuIco').click(function () {
    $.when($('.menuIco').not(this).fadeOut()).then(function () {
        console.log('foo')
    })
})

演示：http: //jsfiddle.net/IrvinDominin/hvm79/

于 2013-09-05T11:18:45.593 回答
1

您可能有多个带有 class 的元素.menuIco。因此，在您的回调中，您应该使用$(this)而不是$('.menuIco p')再次选择。

var loaded = false;

$('.menuIco').not($(this)).fadeOut(function() { // hide all icons but one
    var $this = $(this);

    if(loaded==false) {
        loaded = true;

        $this.find('p').addClass("icoCaptionOff");
        $this.animate({top: "20", left: "-100"}, "fast", function() {
            LoadContent($this.attr('id'));
        });
    }
});
于 2013-09-05T11:11:15.023 回答
0

您可能希望在每个回调函数中都应用回调$(this)而不是.menuIco每个回调函数。

$('.menuIco').not(this).fadeOut(function() { // hide all icons but one

        $(this).find('p').addClass("icoCaptionOff");

        $(this).animate({top: "20", left: "-100"}, "fast", function() {
            LoadContent($(this).attr('id'));
        });

});
于 2013-09-05T11:09:28.033 回答