2

jQuery プラグインを作成していますが、プラグインには二次機能があります ( jQuery サポートを参照)。それぞれに何かをするために、jQuery オブジェクトに含まれる要素をループできるようにしたいと考えています。thisただし、二次関数のスコープでは明らかにプラグイン オブジェクトを参照しているため、元のオブジェクトにアクセスする方法がわかりません。

元の要素にアクセスする方法はありますか、それとも別の (jQuery UI 風の) 手法について考え始める必要がありますか?

コードは次のようになります。

(function ($) {
    'use strict';
    var
        myNewPlugin,
        mySecondaryFunction;

    mySecondaryFunction = function () {
        // the secondary function

        // `this` refers to myNewPlugin
    };

    myNewPlugin = (function () {
        var closedPrivateVariables;

        return function () {
            // the function called from the jQuery object

            return this;
        };
    }());

    myNewPlugin.mySecondaryFunction;

    $.fn.myNewPlugin = myNewPlugin;
}(jQuery));

重複しない(似ているように聞こえるが同じではない質問)

4

1 に答える 1

4

標準のプラグイン パターンは次のようなものです。

(function ($) {
    $.fn.myPlugin = function (options) {
        var settings = {
            // settings
        };
        return this.each(function (i, elem) {
            //do stuff
        });
    };
})(jQuery);

それを二次関数用に拡張し、選択した jQuery オブジェクトへの参照を維持するには、.each()イテレータでそれへの参照をキャプチャするだけです。

(function ($) {
    $.fn.myPlugin = function (options) {
        var settings = {
            // settings
        },
        self = null,
        selectedDOMElements = [],
        mySecondaryFunction = function () {
            var i = 0;
            //do more stuff
            self.css('display', 'inline-block'); //original jQuery object
            for (i = 0; i , selectedDOMElements.length; i += 1) {
                $(selectedDOMElements[i]).css('color', '#F00'); //individual child elements of the original jQuery object
            }
        };
        self = this; //store original jQuery object
        return this.each(function (i, elem) {
            selectedDOMElements.push(elem); //store individual child elements of the original jQuery object
            //do stuff
        });
    };
})(jQuery);

やりたいことに合わせて組み合わせてください。

アップデート:

代わりにこれを試してください:

(function ($) {
    var self;
    $.fn.myPlugin = function (options) {
        var settings = {
            // settings
        };
        self = this; //store original jQuery object
        return self.each(function (i, elem) {
            //do stuff
        });
    };
    $.fn.myPlugin.mySecondaryFunction = function mySecondaryFunction(options) {
        var settings = {
            // settings
        };
        return self.each(function (i, elem) { //apply to original jQuery object
            //do stuff
        });
    };
})(jQuery);

//call like this
$(selector).myPlugin();
$(selector).myPlugin.mySecondaryFunction();

フィドルの例: http://jsfiddle.net/bv7PG/

于 2013-06-24T20:52:09.700 に答える