如何从jquery插件访问方法内的sub方法?

时间:2013-07-13 08:32:14

标签: jquery jquery-plugins methods jquery-1.9

如何从插件中访问方法内的sub方法?例如,在init方法中,我想访问page内的manage方法,

$this.cms(manage.page); // ReferenceError: manage is not defined

基本结构,

(function($){

    var methods = {

        defaults: function(options) {

            // Default options.
            var defaults = {
                setup: {
                    directory: ""
                }           
            }

            // Always leave this line here.
            var options = $.extend(defaults, options);

            // Return the processed options.
            return options;

        },

        init : function( options ) {

            // Must declare a this as the plugin's root itself.
            var $this = this;

            // Call the local method from the plugin itself to get the processed options.
            var o = $this.cms('defaults',options);
            //alert("nothing to load");


            $this.cms(manage.page);
        },

        manage : {

            page: function(options){

                // Must declare a this as the plugin's root itself.
                var $this = this;

                // Call the local method from the plugin itself to get the processed options.
                var o = $this.cms('defaults',options);

                alert("page method");

            },
            menu: function(options){
            }

        },

        add : function( options ) {

        },

        erase : function( options ) { 

        },

        remove: function(object,options) { // to be developed.

        }
    };

    $.fn.cms = function( method ) {

        // @reference: http://docs.jquery.com/Plugins/Authoring#Namespacing
        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 );  // always change 'init' to something else if you different method name.
        } else {
            $.error( 'Method ' +  method + ' does not exist on jQuery.cms' );
        }

        return this; // this is needed to ensure chainability @reference: http://stackoverflow.com/questions/14008121/jquery-namespace-how-to-pass-default-options-from-one-method-to-the-subsequence

    };

})(jQuery);

是否有可能或以其他更好的方式做到这一点?我只想在父方法中使用子方法。

2 个答案:

答案 0 :(得分:0)

您无法使用您拥有的代码访问manage.page。它只允许您调用methods的属性,而不是其他属性。

您可以将page()放在manage对象上,然后将“页面”传递给插件的功能。

答案 1 :(得分:0)

不确定我做得对不对,但这是我的解决方案......

(function($){

    var methods = {

        defaults: function(options) {

            // Default options.
            var defaults = {
                setup: {
                    directory: ""
                }           
            }

            // Always leave this line here.
            var options = $.extend(defaults, options);

            // Return the processed options.
            return options;

        },

        init : function( options ) {

            // Must declare a this as the plugin's root itself.
            var $this = this;

            // Call the local method from the plugin itself to get the processed options.
            var o = $this.cms('defaults',options);
            //alert("nothing to load");


            $this.cms("manage").page();
        },

       manage : function(options){

            // Must declare a this as the plugin's root itself.
            var $this = this;

            // Call the local method from the plugin itself to get the processed options.
            var o = $this.cms('defaults',options);

            // Set the list for holding properties.
            var properties = {
                page : function(){ $.fn.page(); }
            }

            // Return the property.
            return properties;

        },

        add : function( options ) {

        },

        erase : function( options ) { 

        },

        remove: function(object,options) { // to be developed.

        }
    };

    $.fn.cms = function( method ) {

        // @reference: http://docs.jquery.com/Plugins/Authoring#Namespacing
        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 );  // always change 'init' to something else if you different method name.
        } else {
            $.error( 'Method ' +  method + ' does not exist on jQuery.cms' );
        }

        return this; // this is needed to ensure chainability @reference: http://stackoverflow.com/questions/14008121/jquery-namespace-how-to-pass-default-options-from-one-method-to-the-subsequence

    };

})(jQuery);

然后是page的另一个插件,

// A namepace structure:
(function($){

    var methods = {

        defaults: function(options) {

            // Default options.
            var defaults = {
                setup: {
                    directory: ""
                }           
            }

            // Always leave this line here.
            var options = $.extend(defaults, options);

            // Return the processed options.
            return options;

        },

        init : function( options ) {

            // Must declare a this as the plugin's root itself.
            var $this = this;

            // Call the local method from the plugin itself to get the processed options.
            var o = $this.page('defaults',options);

            alert("a page plugin: list page");
        },

        remove: function(object,options) { // to be developed.

        }
    };

    $.fn.page = function( method ) {

        // @reference: http://docs.jquery.com/Plugins/Authoring#Namespacing
        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 );  // always change 'init' to something else if you different method name.
        } else {
            $.error( 'Method ' +  method + ' does not exist on jQuery.page' );
        }

        return this; // this is needed to ensure chainability @reference: http://stackoverflow.com/questions/14008121/jquery-namespace-how-to-pass-default-options-from-one-method-to-the-subsequence

    };

})(jQuery);

似乎很长/乏味,但有效。