10 minutes to learn how to write Jquery plug-in instance tutorial _ jquery-js tutorial

This article mainly introduces how to write Jquery plug-ins in 10 minutes. It is very practical to complete a simple plug-in two steps through an instance, for more information, see jquery plug-ins. Many of my friends have used jQuery plug-ins, but few have written jQuery plug-ins on their own. This article briefly describes the implementation method of jquery plug-ins in the form of examples. Share it with you for your reference. The specific method is as follows:

Specifically, some common, practical, and general functions are encapsulated. Simply put, these codes are put in a method to achieve repeated use, in this way, you do not need to re-write each time you use this function.

Now Jquery has added the plug-in concept, as long as it is written in the same way as function writing in its specific format. It is not complicated. Believe it or not, but I believe it.

Next, I will explain it with simple code. If you have read the plug-in, I will only be speechless.

The procedure is as follows:

Step 1: Define the plug-in

$ (Function () {$. fn. Plug-in name = function (options) {var defaults = {Event: "click", // trigger the RESPONSE Event msg: "Holle word! "// Display content}; var options = $. extend (defaults, options); var $ this = $ (this); // Of course, the response to the event object // feature code section // bind the event $ this. live (options. event, function (e) {alert (options. msg );});}});

Step 2: Call the plug-in

$ (Function () {// bind element event $ ("# test "). plug-in name ({Event: "click", // trigger the RESPONSE Event msg: "plug-in is so simple! "// Display content });});

This is the simplest plug-in! Less than 10 minutes! I believe everyone should have understood it! JQuery plug-in is so simple.