jquery plug-in development Sample code _jquery

JQuery Plugin Development:
Class-level development, development of new global functions
Object-level development to develop new methods for jquery objects
Class-level development-defining a global approach

Copy Code code as follows:

Jquery.foo = function () {
Alert (' This is a test. ');
};

Using namespaces, you can avoid the conflicts of functions within namespaces.

Copy Code code as follows:

jquery.apollo={
Fun1:function () {
Console.log (' fun1 ');
},
Fun2:function () {
Console.log (' fun2 ');
}
}

second, object-level development-Define the jquery object approach

Copy Code code as follows:

(function ($) {
$.fn.pluginname = function () {

};
}) (JQuery);
The plug-in is invoked by this way:
$ (' #myDiv '). Pluginname ();

Accept the options parameter to control the behavior of the plug-in

Copy Code code as follows:

(function ($) {
$.fn.fun2=function (option) {
var defaultoption={
param1: ' param1 ',
Param2: ' param2 '
}
$.extend (defaultoption,option);
Console.log (defaultoption);
}
}) (JQuery);
$ (function () {
by calling this
$ ("Body"). Fun2 ({
param1: ' New Param1 '
});
});

Keep Private Functions Private

Copy Code code as follows:

(function ($) {
Plugin definition
$.fn.hilight = function (options) {
Debug (this);
// ...
};
Private Function for debugging
The "Debug" method cannot be entered from an external closure, so it is private for our implementation.
function Debug ($obj) {
if (window.console && window.console.log)
Window.console.log (' Hilight selection count: ' + $obj. Size ());
};
//  ...
}) (JQuery);