1

公式ドキュメントを含む、最高のjqueryプラグインパターンに関するいくつかの記事を読みました-

http://coding.smashingmagazine.com/2011/10/11/essential-jquery-plugin-patterns/

https://github.com/jquery-boilerplate/patterns/

http://docs.jquery.com/Plugins/Authoring

それでも、私のニーズに最適なものを決定することはできません。誰かがアドバイスしてくれるかもしれません。

今は内部にある関数からパブリック メソッドを作成する必要があります。

現在、私は基本的なプラグイン構造を使用しています:

(function ($) {

   $.fn.plugin = function (options) {
     var defaults = {
       someoption: true
     };

     options = $.extend(defaults, options);

     return this.each(function () {
       // all logic goes here...
       if (options.someoption) {
         mainMethod();
       }

       function mainMethod () {
         // main method bla bla..
         // also calls in certain circumstances this func:
         somePublicMethod();
       }

       function somePublicMethod () {
         // AND this method should be accessible like:
         // $('elem').plugin('somePublicMethod');
       }
     });
  };
})(jQuery);

このsomePublicMethod()関数は次のようにアクセスできる必要があります$('elem').plugin('somePublicMethod');

アイデアはありますか？

4

1 に答える 1

6

プラグインにこのパターンを使用しています。プラグインが初期化されていない場合は、プライベート メソッドとパブリック メソッドを使用し、メソッドの呼び出しを無効にすることもできます。

;(function($, window, undefined) {
    'use strict';        

    /**
     * My Plugin
     * v1.0
     */ 
    $.MyPlugin = function(options, element) {
        // this element
        this.$el = $(element);
        this._init(options); 
    };

    $.MyPlugin.defaults = {
        default1: 1,
        default2: 2
    };

    $.MyPlugin.prototype = {
        /**
        * Private methods
        */
        _init: function(options) {
            // options
            this.options = $.extend(true, {}, $.MyPlugin.defaults, options);
        }, 

        _privateMethod: function() {

        },                                                               

        /**
        * Public methods
        */
        publicMethod: function() {

        }
    }; 

    var logError = function(message) {
        if(window.console) {
            window.console.error(message);
        }                                   
    };

    $.fn.myPlugin = function(options) { 
        this.each(function() {
            var self = $.data(this, 'myPlugin');

            if(typeof options === 'string') {
                var args = Array.prototype.slice.call(arguments, 1);

                if(!self) {
                    logError('cannot call methods on myPlugin prior to initialization; ' +
                    'attempted to call method ' + options);
                    return;               
                }

                if(!$.isFunction(self[options]) || options.charAt(0) === '_') {
                    logError('no such method ' + options + ' for myPlugin self');
                    return;                                                     
                }

                self[options].apply(self, args);

            } else {     
                if(self) {      
                    self._init();  
                } else {             
                    self = $.data(this, 'myPlugin', new $.MyPlugin(options, this));
                }
            } 
        });

        return this;
    }; 
})(jQuery, window);
于 2013-05-06T14:30:46.360 に答える