Question

我正在使用以下模式编写一个jquery插件（因为我不想做$（“＃element”）。myPlugin（），我没有对特定元素做任何事情..无论如何..

$.extend({
    myPlugin: function(){
        //some cool stuff
    }
});

但我还需要一种方法让其他插件更改我的插件行为，我尝试执行以下操作，并得到一个奇怪的错误......

$.extend({
    myPluginStyles: {
        someStuff: {},
        moreStuff: {},
    }
});

$.extend({
    myPlugin: function(options) {
        this.style = $.myPluginStyles[options.style]; //options.style will contain either "someStuff" or "moreStuf"
    }
})

现在，其他插件可以在myPluginStyles对象中添加新的“样式”。至少这是个想法：

$.myPluginStyles.newStyle = {};

现在你可以做$ .myPlugin（{style：'newStyle'}）;

但我收到以下错误：

Uncaught TypeError: Property 'style' of object function (e,t){return new v.fn.init(e,t,n)} is not a function

提前致谢。

Answer 1

$ .extend的样式适用于使用此模式的新插件 $（元素）.yourFunction。

所以，你不想创建插件，你只想为jQuery添加函数。那么你需要做什么：

$.myPlugin=function () {alert('yourfunction') };
$.myPluginSeries={someStuff:'', someStuff2: ''};

我希望我很清楚。

Answer 2

也许这就是你要找的东西？这样，插件就有一个对象'styles'，可以使用registerStyles注册和使用（使用this.styles [name]）。

$.fn.extend({
    myPlugin: {
        styles : {}, //define the style object
        registerStyles : function(name, style) {
            //register name and style in the plugin's styles object
            this.styles[name] = style;
        },
        doStuff: function(name){
            //test by alerting the first value in the styles object
            alert(this.styles[name])
        }
    }
});

用法：

$.fn.myPlugin.registerStyles('myStyle', 'test'); //set style

$('#my_element').myPlugin.doStuff('myStyle'); //do stuff (in this case echo-ing the style)

// or $.fn.myPlugin.doStuff('myStyle'); if you your function is not designed to use an element

我不知道这是不是最佳做法，但这就是我的做法。

See this fiddle演示

jQuery $ .myPlugin（）样式插件

2 个答案: