jquery - jQuery不同的插件实例

Question

我的插件必须为每个对象做不同的事情，同时我需要能够调用各种方法，做很多其他的事情。

我想在这里发生的是，当用户单击first按钮时，它应该调用函数 for test_onediv 而不是 for test_two。

我在 jsFiddle 上的代码：

<button class="test_one">First</button >

<button class="test_two">Second</button >

<div class="called_for"></div>

(function($){
    var globalSettings = {
        success: function(){}
    };

    var methods = {
        init : function(options){
            settings            = $.extend({},globalSettings,options);

            $(this).click(function(){
                settings.success();                
            });                
        }                
    }

    $.fn.test = function(method, options){
        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);


$(".test_one").test({
    success: function(){
        $(".called_for").text("I got called for 'test_one'");
    }
});


$(".test_two").test({
    success: function(){
         $(".called_for").text("I got called for 'test_two'");
    }
});

​</p>

Answer 1

您没有声明settings，因此它是全局的，因此被第二个插件调用覆盖。请使用var：http: //jsfiddle.net/q6e38/4/。

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

Answer 2

使用这个骨架，运行良好： https ://github.com/OscarGodson/jQuery-Plugin-Skeleton