Self-built jquery plug-in to automatically add and delete rows

As shown in the following figure. For the demo address, click

Since it is a plug-in, you should be able to use jquery like $ ("div"). method ({}) to call it. Its approach is:
Copy codeThe Code is as follows:
(Function ($ ){
}) (JQuery );

Then name the plug-in:
Copy codeThe Code is as follows: $. fn. autoAdd = function (options ){}
In this way, we can use $ (dom) in the page ). autoAdd ({...}) to call this plug-in, and then we will give it some specific parameters, such as the row to be copied and the button to be added and deleted, these are all identified by class;
Copy codeThe Code is as follows:
Var settings = {changeInput: $ ("# input"), tempRowClass: "tempRow", min: 1, max: 90, addButtonClass: "addbtn", delButtonClass: "delbtn ", addCallBack: null, delCallBack: null, indexClass: "index", insertClass: "insertbtn", moveUpClass: "moveupbtn", moveDownClass: "movedownbtn "};
If (options) $. extend (settings, options );

It looks a little long. Actually, there is nothing. Maybe you suddenly want to add a mouse to move the style up, or you can continue to add it later. Here I have given some default values for convenient calls. Let's explain the meaning of these variables. changeInput is a text box that I add. the number that I want to input will show the number of rows. temRowClass is the template row that I want to copy, the following is a good understanding;
Due to the time relationship, we will be here today. We will explain in detail how these functions are implemented tomorrow.