Home > Web Front-end > JS Tutorial > body text

JQuery plug-in development sample code_jquery

WBOY
Release: 2016-05-16 17:17:12
Original
1030 people have browsed it

JQuery plug-in development:
Class level development, develop new global functions
Object level development, develop new methods for Jquery objects
1. Class level development- Define global method

Copy code The code is as follows:

jQuery.foo = function( ) {
alert('This is a test.');
};

Using namespace can avoid function conflicts within the namespace.
Copy code The code is as follows:

jQuery.apollo={
fun1:function( ){
console.log('fun1');
},
fun2:function(){
console.log('fun2');
}
}


2. Object level development - defining jQuery object methods

Copy code The code is as follows:

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

};
})( jQuery);
//The plug-in is called like this:
$('#myDiv').pluginName();

Accepts the options parameter to control the behavior of the plug-in
Copy code The code is as follows:

(function($){
$.fn.fun2=function (option){
var defaultOption={
param1:'param1',
param2:'param2'
}
$.extend(defaultOption,option);
console.log (defaultOption);
}
})(jQuery);
$(function(){
//Called like this
$("body").fun2({
param1:'new Param1'
});
});

Keep private functions private
Copy code The code is as follows:

(function($) {
// plugin definition
$.fn.hilight = function(options) {
debug(this);
// ...
};
// private function for debugging
// The "debug" method cannot be entered from the external closure, so for our implementation it is Private.
function debug($obj) {
if (window.console && window.console.log)
window.console.log('hilight selection count: ' $obj.size());
};
// ...
})(jQuery);
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!