如何扩展jQuery插件'；什么方法？

在下面的代码中，我尝试扩展我的测试插件。我想在现有插件中添加一个新的方法定义

(function($) {
    var settings = {
        bg: 'white'
    };

    var methods = {
        init: function(options) {
            options = $.extend({}, options, settings);
            return this.each(function () {
                $(this).data("test", options);
            });
        },
        whiten: function() {
            var options = this.data("test");
            this.css('background-color', options.bg);
        }
    };

    $.fn.test = 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');
        } 
    }  

})(jQuery);

// New Method Definition
 var methods = {     
        newMethod: function(){
            alert('umut');   
      }
 };


// Extending test plugin with newMethod
$.fn.extend(true,$.fn.test, methods );

$(document).ready(function() {
    $('ul').test().css('background-color', 'wheat');
    $('#go').click(function() {
        $('ul').test("whiten");
        // Calling newMethod
        $('ul').test("newMethod");    
    });
});

但我在firebug控制台上遇到以下错误：

未捕获异常：方法newMethod不存在

我怎样才能延长期限

var methods = {
}

在我的测试插件中阻塞

---

这是JSFIDLE。

您不能，因为

方法

只是函数的本地方法。只有从外部访问它，才能扩展它。

编辑：我正在更改答案。这可能是更简单的解决方案，因为它需要更少的代码更改。添加

方法

作为插件的属性。定义插件函数后添加此行：

$.fn.test.methods = methods;

这需要在定义插件的闭包中。其余的代码应该可以正常工作，通过

$.extend（）

扩展

test

，就像您已经在做的那样

以下是我最初的答案：

如果你想以这种方式扩展你的插件，你的插件必须公开这样做的方法。您可以将

方法

添加为

设置

中的属性，然后在

init

方法中使用

选项深入扩展
设置.methods

如果打算将
设置
作为默认设置，并将
选项
覆盖设置，则在调用
.extend（）
时，您的参数已被颠倒。反转参数，然后添加
true
作为第一个参数，使其成为深度扩展：

options = $.extend(true, {}, settings, options);

然后将您的方法放入
设置中
：

var settings = {
    bg: "white",
    methods: {
        init: function(options) {
            options = $.extend(true, {}, settings, options);
            ... // etc.
         },
         ...
    }
};

然后，不要通过
$.extend（）
扩展插件的方法，而是在
init
调用中进行扩展：

$(".foo").test("init", { methods: methods });

对于那些使用jQuery团队推荐的插件结构的人来说，如果只向$.fn对象添加了一个函数，因此只有一个公共函数，那么很难添加方法。因此，在我的例子中，我决定最好的解决方案是在插件中添加一个扩展methods变量的方法。这将作为任何其他功能从插件外部访问。示例如下：

(function($) {
    var settings = {
        bg: 'white'
    };

    var methods = {
        init: function(options) {
            options = $.extend({}, options, settings);
            return this.each(function () {
                $(this).data("test", options);
            });
        },
        whiten: function() {
            var options = this.data("test");
            this.css('background-color', options.bg);
        },
        extendMethods: function(newMethods) {
            $.extend(true, methods, newMethods);
            return $(this);
        }
    };

    $.fn.test = 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');
        } 
    }  

})(jQuery);

瞧！那么你只需要这样称呼它：

$.fn.test('extendMethods',{...Methods object here...});

注意：我知道这首先需要您编辑插件代码，但是没有太多可添加的内容，在许多情况下可能是可行的。希望它能帮助别人
 这是我在上读到的推荐的插件编写风格。我如何修改这个插件，使其可扩展为新方法？@Luffy：正如我所说，你必须使
方法可以从外部访问。一种选择是创建另一个函数，该函数接受一个对象并扩展方法。。。。问题是你为什么要这样做？我想扩展一个插件，这个插件在不涉及源代码的情况下非常可笑。我不想每次他们发布升级时都修改它的源代码。我认为这是修改它的源代码的最简单的方法，而且不会涉及太多的行。谢谢