Javascript 如何防止回调多次触发？

我在这里看到了一些与此相关的问题（包括使用when/promise解决方案），但它们似乎不起作用。基本上，我一次为多个元素设置动画，并在回调函数中调用一个函数，但该函数被调用多次-对于每个正在设置动画的元素。。。这是我的密码：

OBJCollection.css({
    'width': '0em',
    'height': '0em'
}).animate({
    'width': Screens.ImageW / 16 + 'em',
    'height': Screens.ImageH / 16 + 'em'
}, {
    duration: Screens.currentImageParent.data('LightboxFadeSpeedIn'),
    queue: false,
    step: function (now, fx) {
        componentScaler();
    },
    complete: function () {
        $Content.show('fade', Screens.currentImageParent.data('ContentFadeSpeedIn'));
        //calling function here
    }
});

我试图：

if (!OBJCollection.is(':animated')) { ... call function }

这没用。我还尝试了一个关于when的解决方案，但这似乎打乱了我的函数调用（它根据OBJCollection的最终动画大小定位其他元素）。我不确定（因为这是我第一次使用when/promise），但它是否会在第一项设置动画并忽略所有其他项后触发回调一次？看起来它就是这么做的，但我正在寻找一种解决方案，当所有项目都完成动画制作时，会触发回调

有什么想法吗？

使用承诺对象

OBJCollection.css({
    'width': '0em',
    'height': '0em'
}).animate({
    'width': Screens.ImageW / 16 + 'em',
    'height': Screens.ImageH / 16 + 'em'
}, {
    duration: Screens.currentImageParent.data('LightboxFadeSpeedIn'),
    queue: false,
    step: function(now, fx) {
        componentScaler();
    }
}).promise().done(function() {
    $Content.show('fade', Screens.currentImageParent.data('ContentFadeSpeedIn'));
    //calling function here
});​

---

这是可行的，不会抛出任何错误，但就像我说的，我给了它一个镜头，它看起来像是在第一个动画完成后启动回调，然后忽略其余的。。。我正在寻找一种等待所有动画完成的方法。剩下的是什么？promise对象将等待选定元素上的所有现有动画完成。我正在阅读promise的文档（很抱歉以前从未使用过它），它应该在集合中的所有动画完成后运行该功能。。。所以我不太清楚为什么在我的情况下它似乎不能正常工作。什么是

componentScaler（）

？它在做动画吗？它根据OBJCollection的位置/维度定位其他元素。我认为promise是有效的，但我需要重写我的一些其他代码，我会将其标记为答案。谢谢！：）