0

私はこれに対する答えをインターネットで探しましたが、役に立ちませんでした。答えはおそらく非常に単純だと思いますが、私にはわかりません。

私は jQuery プラグインを作成しており、すべてのベスト プラクティスに従っています。私のプラグインが foo と呼ばれ、次の標準プラグイン定義があるとしましょう:

(function($){
  $.fn.foo = function() {
    this.append('<p>I'm doing stuff!</p>');
  }
})(jQuery);

これまでのところかなり基本的です。ここで、bar という関数にカプセル化したい内部機能があるとします。ただし、キャッチは次のとおりです。チェーンなどを利用できるように、jQueryプラグインのように呼び出したいです。つまり、次のように使用できるようにしたいです。

(function($){
  /* this is bad: it clutters up the namespace, and exposes implementation details:
  $.fn.bar = function(text) {
    this.append('<p>'+text'</p>');
  }
  */
  $.fn.foo = function() {
    this.append('<p>I'm doing stuff!</p>').bar('bar does something else!');
  }
})(jQuery);

bar を宣言して jQuery プラグインのように呼び出すことができますが、プラグインの範囲外では使用できません。

私は Javascript の apply メソッドをいじり、何とか機能するものを手に入れましたが、それはぎこちなく、jQuery オブジェクトをパラメーターとして関数を呼び出すだけでした。

簡単な解決策があると確信しています...誰か？

4

1 に答える 1

1

イーサン、ここで提唱されているプラ​​グインパターンを使用すると、プライベート関数やさまざまなパブリックメソッドなど、さまざまな可能性が1つのプラグイン内に存在します。

あなたはプライベートな機能を持つことができ、それらはおそらく（ある種の）連鎖可能である可能性がありますが：

  • 内部呼び出しは。で行われる傾向があるため、通常、内部でチェーンすることはできません.call()。
  • パブリックメソッドは通常、の形式であるため、通常、内部で連鎖性を必要としないか、必要としません。return this.each(function(){...});このループ内で、コードは、それが作用するjQuery選択の単一の要素をアドレス指定します。

例えば ​​：

(function($){
    // **********************************
    // ***** Start: Private Members *****
    var pluginName = 'foo';
    var cough = function(text, bgColor) {
        text = text || ''; 
        bgColor = bgColor || '#FFF';
        $(this).append($('<p/>').append(text).css('backgroundColor', bgColor));
    };
    // ***** Fin: Private Members *****
    // ********************************

    // *********************************
    // ***** Start: Public Methods *****
    var methods = {
        init: function(text) {
            text = text || 'foo init!';
            return this.each(function() {
                methods.bar.call($(this), 'cough from bar from init');
                cough.call($(this), 'cough from init');
            });
        },
        bar: function(text) {
            text = text || 'cough from bar!';
            return this.each(function() {
                cough.call(this, text, '#99CC99');
            });
        }
    };
    // ***** Fin: Public Methods *****
    // *******************************

    // *****************************
    // ***** Start: Supervisor *****
    $.fn[pluginName] = function( method ) {
        if ( methods[method] ) {
            return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } else if ( typeof method === 'object' || !method ) {
            return methods.init.apply( this, arguments );
        } else {
            $.error( 'Method ' + method + ' does not exist in jQuery.' + pluginName );
        }
    };
    // ***** Fin: Supervisor *****
    // ***************************
})(jQuery);

ここで、プラグイン「foo」には、パブリックメソッド「init」と「bar」、およびプライベートユーティリティ「cough」があります。これは、initと「bar」の両方によって内部的に呼び出されます。

あなたは呼び出すことができます

$("div").foo(); //same as $("div").foo(init');
$("div").foo('bar', 'cough from bar');

ただしcough、外部から呼び出すことはできません。

注：上記のパターンでは、スーパーバイザーは常にまったく同じです。編集する必要はありません。

于 2013-03-21T20:57:46.807 に答える