Jquery plugin development and jquery plugin

Jquery plugin development and jquery plugin

It wasn't until the last time I wrote a small feature that I had the chance to try to write plug-in development that I wanted a long time ago. Even more depressing is that it is not until the plug-in is written that you fully understand what object orientation is! (I don't know what I think. When I sent this sentence in the QQ space, everyone commented, "I have to leave my ticket ?" "Is there an object ?" What's more, "I understand that the programmer's object is the code", which is not empty .)

Refer to a lot of online information, and then compare, and finally refer to the first simple plug-in made by Liu woyong's blog (http://www.cnblogs.com/Wayou/p/jquery_plugin_tutorial.html), here record the complete plug-in format and related notes, convenient and fast development. Sharing is fun.

// You can enter the version number, plug-in purpose, copyright, and plug-in usage format in the form of annotations.
// Add; can prevent the previous code from being absent; the end result is not afraid of Compression
; (Function ($, window, document, undefined) {// undefinde is real undefined, not a parameter // pass the selectable variables to the method // define the constructor (object) var Datalist = function (ele, opt) {this. $ element = ele; this. defaults = {// define the default attribute 'default attribute name': 'corresponding attribute name'}, this. options = $. extend ({}, this. defaults, opt); // The $. the extend () function allows custom property values to overwrite the default property values in default. The preceding {} empty object is added to prevent the default attribute value from being modified in the previous attribute value during multiple calls.
　　
// Some common attribute methods can be added for the following methods
}
// Define the method on the object prototype. The number of methods is not limited to Datalist. prototype = {showList: function () {var color = this. options. bgcolor; // value transfer form (it is best to extract all the required values here. After all, this is different in different environments)
// Here is the specific implementation process writing area
Return this; // return is to avoid damaging the characteristics of jquery chained call (note that the return object is the original object), or callback a function in the form of a return value }}
// Use the Datalist object in the plug-in $. fn. myDatalist = function (options) {// create an object var datalist = new Datalist (this, options); // call the return datalist method in the form of a return value call. showList () ;}} (jQuery, window, document); // It is actually the closure form of (function () {}();, which defines anonymous functions and calls them immediately, the event binding in it can be used as defined globally (destroyed only when the page is closed), but it is invisible in the global space and cannot be obtained.

// Call the plug-in as needed

$ (Document). ready (function (){
$ (Object). myDatalist ({"attribute name": "attribute value"}); // The default value is used for attributes not set.
});

I can write so much, copy, paste, and rename it. If you want to obtain more details (for example, how to release the jQuery plug-in), please refer to the link above (Thank you for your consideration ...). If you have any questions about the annotations, please let me know. Thank you!

Next is the commonly used plug-ins I used to rewrite over the past few days (previously, they were all process-oriented and were written once ...), I hope it will help me with the same cainiao.