0

我创建了一个包含以下代码的插件：

var myplugin = {
    init: function(options) {
         $.myplugin.settings = $.extend({}, $.myplugin.defaults, options);
    },
    method1: function(par1) {
        .....
    },
    method2: function(par1) {
        .....
    }
};
$.myplugin = function(method){
     if ( myplugin[method] ) {
    return myplugin[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
     } else if (typeof method === 'object' || !method) {
        return myplugin.init.apply(this, arguments);
     } else {
    $.error( 'Method "' +  method + '" does not exist in myplugin!');
     }
};
$.myplugin.defaults = {
     option1: 'test',
     option2: '',
     option3: ''
};
$.myplugin.settings = {};
$.myplugin();

这很好用，但问题是当我尝试设置超过 1 个选项并尝试在之后返回其值时，它会给出空值；设置一个选项效果很好。例如。如果在更改第一个组合框值时，我称之为： $.myplugin({option1: 'first test'}); 它可以工作，但是当我尝试在第二个组合框中调用另一个时，它不会保存该选项，而是重置为空。

有什么解决办法吗？

4

1 回答 1

0

我将重新组织插件以使用此结构：

var methods = {
    settings: {
        foo: "foo",
        bar: "bar"
    },
    init: function(options) {
        this.settings = $.extend({}, this.settings, options);
    },
    method1: function(par1) {
        alert(this.settings.foo);
    },
    method2: function(par1) {
        alert(this.settings.bar);
    }
};

function MyPlugin(options) {
    this.init(options);
    return this;
}
$.extend(MyPlugin.prototype, methods);
$.myPlugin = function(options) {
    return new MyPlugin(options);
}

/* usage */

// without parameters
var obj1 = $.myPlugin();
// with parameters
var obj2 = $.myPlugin({foo: "foobar"});
// each has it's own settings
obj1.method1();
obj2.method1();

演示：http: //jsfiddle.net/ypXdS/

本质上$.myPlugin只是创建并返回 MyPlugin 类的一个新实例。你可以完全摆脱它并new myPlugin(options)在它的地方使用。

于 2012-06-08T20:54:15.593 回答