Learn to write Jquery plug in examples in 10 minutes
- 2020-03-30 03:53:23
- OfStack
There are many friends have used jquery plug-in, but few people have written their own jquery plug-in, this article is a simple description of the implementation of jquery plug-in in the form of examples. Share with you for your reference. Specific methods are as follows:
In particular, it is the encapsulation of some common, practical, and general functions. Simply put, it is the code in a method, can achieve the effect of reuse, so that you do not need to use this function every time to write again.
Now Jquery has added the concept of a plug-in, just write it in its specific format as if it were a function. Believe it or not, I do.
I'm going to explain it in simple code, but if you can't write a plug-in, I'm going to be speechless
The specific steps are as follows:
Step 1: define the plug-in
$(function() {
$.fn. The plug-in name = function(options) {
var defaults = {
Event : "click", //Trigger response event
msg : "Holle word!" //According to the content
};
var options = $.extend(defaults,options);
var $this = $(this); //Of course, respond to the event object
//Functional code section
//The binding event
$this.live(options.Event,function(e){
alert(options.msg);
});
}
});
Step 2: invoke the plug-in
$(function() {
//Binding element events
$("#test"). The plug-in name ({
Event : "click", //Trigger response event
msg : " Plugins are that simple !" //According to the content
});
});
At this point, the simplest plug-in is done! Less than 10 minutes! I believe you should all understand it! JQuery plugins are as simple as that.