1

次の例のように、特定の要素に適用された jQuery プラグインを返す小さな関数を作成しました。

var initiate_shop = function(shop_navigation, options, callback) {

    var default_settings = {
        containerID     : "",
        first           : false,
        previous        : false,
        next            : false,
        last            : false,
        startPage       : 1,
        perPage         : 8,
        midRange        : 15,
        startRange      : 1,
        endRange        : 1,
        keyBrowse       : true,
        scrollBrowse    : false,
        pause           : 0,
        clickStop       : true,
        delay           : 50,
        direction       : "auto",
        animation       : "fadeInUp",
        fallback        : 400,
        minHeight       : true,
        callback        : function(pages, items){
            if(typeof callback == 'function') {
                callback.call(this);
            }
        }
    };

    var settings = $.extend(default_settings, options);

    return $(shop_navigation).jPages(settings);
};

initiate_shop私の質問は、次のようにその関数をどのように使用できるかです。

$("shop_navigation").initiate_shop( ... );

このように使用する代わりに:

initiate_shop(shop_navigation, ... );

また、コールバック関数の引数を定義するにはどうすればよいですか?私の状況では、コールバック関数の引数として 2 つのオブジェクトがありますか?

4

1 に答える 1

3

jQuery プラグインを作成しようとしているようです。関数でオブジェクトを拡張すると、関数内からキーワード$.fnを使用してコンテナーにアクセスできるようになります。this

$.fn.initiate_shop = function(options, callback) {
    ...
    return this.jPages(settings);
};

$('shop_navigation')という名前の要素を探している場合を除き、呼び出しは有効なセレクターではないことに注意してくださいshop_navigation。書くつもりだったの$('#shop_navigation')

私が尋ねている理由は、あなたが同じように書くかもしれないということです

$('.shop_navigation').initiate_shop(options, callback);

渡される複数の要素のサポートを処理するのはプラグイン次第thisです。


を使用して現在コールバックを呼び出している方法は、コールバック関数.callのコンテキスト、つまりthisキーワードを指定する場合に便利です。

コールバックが次のようになっているとします。

var callback = function(pages, items) {
   console.log(this);
   console.log(pages);
   console.log(items);
};

thisコールバック関数内のキーワードが何であるかを気にしない場合は、単に関数を次のように呼び出すことができます

callback(pages, items);

呼び出しコンテキストを手動で設定する場合は、.callまたはを使用でき.applyます。関数に引数を渡すこともできます。

// first argument defines calling context
// all others passed as arguments to function
callback.call(this, pages, items);

また

// first argument defines calling context
// second argument defines entire arguments collection
callback.apply(this, [pages, items]);

あなたの場合、callback変数が関数または未定義のみであり、現在のように追加のロジックを追加しない場合、次のようにするだけで済みます。

var default_settings = {
    ...
    callback: callback
};
于 2012-05-10T09:51:57.157 に答える