Skip to content

Instantly share code, notes, and snippets.

@Ellrion
Last active February 29, 2020 15:42
Show Gist options
  • Save Ellrion/29b5194f9b7d32a4e282 to your computer and use it in GitHub Desktop.
Save Ellrion/29b5194f9b7d32a4e282 to your computer and use it in GitHub Desktop.
Jquery plugin template
/**
* JQuery plugin SimplePlugin v 1.0 [26.05.14 10:59]
* TODO: DESCRIPTION
* Created by ...
* Contacts: ...
*/
// don't declare anything out here in the global namespace
(function($) { // create private scope (inside you can use $ instead of jQuery)
// functions and vars declared here are effectively 'singletons'. there will be only a single
// instance of them and they are not publicly accessible. so this is a good place to declare
// any immutable items or stateless functions. for example:
function myPrivateHelper() {
// some helper fn
};
// next, declare the plugin function
$.fn.SimplePlugin = function(options) {
// functions and vars declared here are created each time your plugn function is invoked
// and have access to the options passed to your plugin fn
//var $.extend({}, $.fn.ellDatepicker.defaults, options);
function anotherHelper() {
// helper fn that has access to 'options'
};
// iterate the matched nodeset (and return 'this')
return this.each(function() {
var $this = $(this);
// functions and vars declared here are created for each matched element. so if
// your functions need to manage or access per-node state you can define them
// here and use $this to get at the DOM element
});
};
// finally, I like to expose default plugin options as public so they can be manipulated. one
// way to do this is to add a property to the already-public plugin fn
$.fn.SimplePlugin.defaults = {
// whatever options you intend to be customizable, for example
color: 'black'
};
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment