I'm following the guidelines for plugin authoring on jquery's website, but I'm having trouble figuring out how to call a main plugin method from another method within the same plugin.
I have a plugin like this:
(function($){
var methods = {
init: function(options) {
var settings = {};
//this == context element of plugin, already jquery
return this.each(function() {
var $this = $(this);
if( options ) {
settings = $.extend({}, settings, options);
}
var data = $this.data('PluginData');
if(!data) {
//set up
}
});
},
some_fn: function() {
//do some stuff
},
another_fn: function() {
//do other stuff, then somehow call some_fn(), maybe via methods.some_fn() ?
}
};
j开发者_如何转开发Query.fn.SomePlugin = 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 {
console.log('there was an error');
}
};
})(jQuery);
This is pretty much the skeleton code from jquery. However, what I'm having trouble with is figuring out the best way to create a "utility" function that is just for my plugin methods, or how to call one plugin method from another.
For example, in my plugin, I have 3 methods, init
, some_fn
, and another_fn
. When I call $('#el').SomePlugin('another_fn')
, within another_fn
, I'd like to call some_fn
. How can I do this? Calling methods.some_fn()
will probably work, however, then this is dependent on the order the methods are defined within the methods object, correct? So I could call some_fn
from another_fn
, but not vice versa?
Additionally, what's the correct way to create a utility function that all the methods in my plugin can use, so that I am not cluttering the global namespace? Do I just define the utility functions at the beginning of my plugin, right before the call to var methods?
EDIT: Thanks to Matt Ball, I have confirmed that methods.some_fn() DOES work for calling other main methods. Now I just want to know what the best practice for creating a (private) utility function is
For a best practice you should check out: http://jqueryboilerplate.com They give examples for exactly your question. :)
For your example you could take advantage of the scope of the init
function:
(function($){
var methods = {
init: function(options) {
var settings = {};
var privateMethod = function(){ ... }
//this == context element of plugin, already jquery
return this.each(function() {
var $this = $(this);
if( options ) {
settings = $.extend({}, settings, options);
}
var data = $this.data('PluginData');
if(!data) {
//set up
}
});
},
some_fn: function() {
//call private function
privateMethod()
// do some stuff
}
};
jQuery.fn.SomePlugin = 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 {
console.log('there was an error');
}
};
})(jQuery);
精彩评论