Based on jQuery, click the last row to implement the row auto-Increment Effect. jquery table

Based on jQuery, click the last row to implement the row auto-Increment Effect. jquery table

All transactions are pursuing efficiency and humanization. Of course, the same is true for Web pages. If you can edit a data table and edit it to the last row, you can click here to automatically add a row, this is a more humane effect, you can save a bit of effort, the following is a piece of such code.

The Code is as follows:

<! DOCTYPE html> 
The above Code meets our requirements. Click the last row of the table to automatically Add a new row. The following describes the implementation process.
I. Code comments:
1. $ (function () {}). When the document structure is fully loaded, run the code in the function.
2. var oTable = $ ("# count") to get the object whose id attribute value is count. Here it is the table object.
3. iNum = 1. Declare a variable and assign the initial value to 1. In the future, + 1 can be added as the row number.
4. eEle = '', declare a variable to store row objects.
5. oTable. on ('click', function (e) {}), register a click event handler for the table object.
6. var target = e.tar get to get the clicked source object.
7. oTr = $ (target). closest ('tr ') to obtain the latest tr ancestor element.
8. f (oTr. index () = oTable. find ('tr '). last (). index () to check whether the last row is clicked.
9. iNum ++, iNum value plus 1.
10. eEle = oTr. clone () to clone the object of the current row.
11. eEle. find ('td '). eq (0). text (iNum), set the value of the first cell in the last row.
12. oTable. append (eEle) to add the last row of the table.
All the content of the table for jQuery implementation clicking the last row to implement the row auto-incrementing effect is described in this article. The above content is highly annotated. If you have any questions, refer to it, thank you very much for your support for the customer's home website.
Articles you may be interested in:

 

 
  
JQuery-based Spin Button custom text box value auto-increment or auto-Increment
 
  
Jquery plug-in makes self-growth input box implementation code