Javascript jQuery children（）.fadeOut（）然后执行单个函数

我有一个jQuery函数，如下所示：

$.get(urlCall, function (data) {
    $('#divId').children().fadeOut("slow", function() {
        $('#divId').append(data);
        $('#divId').fadeIn("slow");
    });
});

问题是它为“#divId”下的每个子级调用一次append和fadeIn行。我在等电话

$('#divId').children().fadeOut("slow", function() {    

淡出所有子项，然后执行函数（）一次。但由于它对每个子级执行一次function（），因此我添加了很多不希望添加的行

我确信一定有一种方式可以说，“让所有的孩子淡出，然后做一次X”，但我似乎不知道怎么做

帮助？

您可以使用

.promise（）方法返回一个动态生成的承诺，该承诺是 一旦绑定到集合的特定类型的所有操作都已解决， 排队与否，已结束

默认情况下，类型为“fx”，这意味着已解析返回的承诺 选定元素的所有动画完成后

为落选的选民 演示：

您可以使用

.promise（）方法返回一个动态生成的承诺，该承诺是 一旦绑定到集合的特定类型的所有操作都已解决， 排队与否，已结束

默认情况下，类型为“fx”，这意味着已解析返回的承诺 选定元素的所有动画完成后

为落选的选民

---

演示：

为什么不将淡入和附加分开？是的

$.get(urlCall, function (data) {
    $('.someElement').each(function(){
         $('.fadeElement').fadeIn();

    });

    $('.otherElement').append(data)
});

---

为什么不把淡出和附加分开呢？是的

$.get(urlCall, function (data) {
    $('.someElement').each(function(){
         $('.fadeElement').fadeIn();

    });

    $('.otherElement').append(data)
});

---

唯一可靠地做到这一点的方法是创建自己的函数，跟踪完成的动画数量，并与原始动画的数量进行比较。比如：

var target = $("#divId"),
    children = target.children();

$("#trigger").on("click", function () {
    toggleFadeAll(children, function () {
        $("#message").fadeToggle();
    });
});

function toggleFadeAll(els, callback) {
    var counter = 0,
        len = els.length;
    els.fadeToggle(function () {
        if (++counter === len) {
            callback.call(null);
        }
    });
}

演示：

（这显然需要根据您实际希望进行的动画设置进行调整）

当所有

fadeToggle

动画完成后，

toggleFadeAll

将调用提供的回调

---

当元素可能出现其他动画时，使用

.promise（）

会失败（在正确的时间点不执行所需的回调）。

唯一可靠的方法是创建自己的函数，跟踪完成了多少动画，并与原始动画的数量进行比较。比如：

var target = $("#divId"),
    children = target.children();

$("#trigger").on("click", function () {
    toggleFadeAll(children, function () {
        $("#message").fadeToggle();
    });
});

function toggleFadeAll(els, callback) {
    var counter = 0,
        len = els.length;
    els.fadeToggle(function () {
        if (++counter === len) {
            callback.call(null);
        }
    });
}

演示：

（这显然需要根据您实际希望进行的动画设置进行调整）

当所有

fadeToggle

动画完成后，

toggleFadeAll

将调用提供的回调

---

当元素可能发生其他动画时，使用

.promise（）

失败（在正确的时间点不执行所需的回调）。

@Kayo-只有这样才能解决这个问题。向上投票所有事情。@Arun-所以promise只会在处理完整个集合后采取一次行动，然后“完成”将确保在执行回调之前完成淡出动画？@TravisJ是的<代码>承诺在选定元素的所有动画完成后得到解决@Kayo-只有这样才能解决这个问题。向上投票所有事情。@Arun-所以promise只会在处理完整个集合后采取一次行动，然后“完成”将确保在执行回调之前完成淡出动画？@TravisJ是的<代码>承诺在选定元素的所有动画完成后解决这没有任何帮助。

.append（）

调用不会等待

.fadeIn（）

调用（这是异步动画）完成，这是OP在同步调用时要求的。这没有任何帮助。

.append（）

调用不会等待

.fadeIn（）

调用（这是异步动画）完成，这是OP在同步调用时要求的