將jQuery傳遞給.animate Callback

Question

我已經設置了一個簡單的動畫師方法，如下所示：

Animator: function (obj, aniArgs, duration, aniEasArgs, completeFunction) {
    obj.stop(true, true).animate(aniArgs, {
        duration: duration,
        queue: false,
        specialEasing: aniEasArgs,
        complete: function () {
            if (completeFunction !== null) {

            };
        }
    });
    return obj;
},

我想做的是能夠傳遞jQuery字符串以在完整的回調中運行。 其他一切都很好。 例如，我將如何傳入

$('#someElement').hide(500);

進入回調？

謝謝！

Answer 1

首先，使用您要運行的代碼創建一個函數：

function complete() {
    $('#someElement').hide(500);
}

然后，在調用Animator時傳遞該函數：

Animator( obj, aniArgs, duration, aniEasArgs, complete );

或者，您可以將函數內聯：

Animator( obj, aniArgs, duration, aniEasArgs, function() {
    $('#someElement').hide(500);
});

這些都以相同的方式工作，您可以使用任何一種樣式，具體取決於使代碼更易於閱讀的內容。

無論哪種方式，將您的Animator代碼更改為：

        if( completeFunction ) {
            completeFunction();
        };

或者，你會經常看到這樣寫的：

        completeFunction && completeFunction();

他們都做了完全相同的事情。 這只是你使用的味道問題，我想我會提到兩種變化，所以當你看到它們時你會認出它們。

請注意，此處不需要!== null測試，實際上並不是您想要的。 那是因為如果調用者沒有傳入一個completeFunction ，那么該變量的值將是undefined ，而不是null ，因此您的測試將無效。 有趣的是，在這種情況下你可以使用!= null ，因為它將測試null和undefined並對它們進行相同的處理。 但實際上你根本不需要這個顯式測試，如果你唯一要檢查的是調用者是否提供了一個completeFunction函數回調。

Answer 2

嘗試

Animator: function (obj, aniArgs, duration, aniEasArgs, completeFunction) {
    obj.stop(true, true).animate(aniArgs, {
        duration: duration,
        queue: false,
        specialEasing: aniEasArgs,
        complete: function () {
            if (jQuery.isFunction(completeFunction )) {
                completeFunction.apply(this, arguments);
            };
        }
    });
    return obj;
},

Theb

x.Animator(obj, aniArgs, duration, aniEasArgs, function(){
    $('#someElement').hide(500);
})