javascript - 如何链接 .call() 函数 - 将过渡添加到 Nivo Lightbox

Question

我正在尝试为 Nivo Lightbox 中显示的项目实现 CSS 动画过渡。 我已插入并运行新函数，但以下 2 个函数在其完成之前运行。

$('.nivo-lightbox-prev').off('click').on('click', function(e){
    e.preventDefault();                
    var index = galleryItems.index(currentLink);
    currentLink = galleryItems.eq(index - 1);
    if(!$(currentLink).length) currentLink = galleryItems.last();
    $this.options.beforePrev.call(this, [ currentLink ]);  # <---- new function I added
    $this.processContent(content, currentLink);            # <---- existing function 1
    $this.options.onPrev.call(this, [ currentLink ]);      # <---- existing function 2
});

我知道的唯一方法是将它们放入回调中，但是 .call() 不接受回调。

我尝试过这个:

function beforePrev(callback){
    $this.options.beforePrev.call(this, [ currentLink ]);
    callback();
}
function onPrev(){
    $this.processContent(content, currentLink);
    $this.options.onPrev.call(this, [ currentLink ]);
}
beforePrev(onPrev);

但它的行为是一样的。

如果相关的话，beforePrev 的代码是:

beforePrev: function() {
    el = $('.nivo-lightbox-content');
    el.addClass('animated fadeOutLeft');
    el.one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function (e) {
        el.removeClass('fadeOutLeft');
    });
},

谁能给我指出正确的方向吗？

<小时/>

更新/编辑以更加清晰: 这是完整的原始 Nivo 代码:link

根据我的理解，$this 只是一个引用 init 函数的标准变量，而不是 DOM 对象。我认为这就是这似乎很难做到的原因之一。

Answer 1

使用.queue()

为了仅在函数 a 完成执行后才执行函数 b:

$('element').a()
.queue(function() {
   $('element').b();
   $(this).dequeue();
});