jquery表格增加删除后改变序号

有个小bug,懒得修了。

目的:增加一行的时候,td第一列排序。

   删除一行的时候,td第一列排序

 1 <!DOCTYPE HTML>
 2 <html>
 3     <head>
 4         <script src="../bower_components/jquery/dist/jquery.js"></script>
 5     </head>
 6     
 7     <style>
 8         div {
 9             width: 300px;
10             height:300px;
11             border: 1px solid red;
12             background-color: grey;
13         }
14     
15         #myTable {
16             width: 100px;
17             height:100px;
18             border: 1px solid red;
19         }
20     
21         #myTable tr, #myTable td {
22             border: 1px solid red;
23         }
24     </style>
25     
26     <script>
27         var arr = [];
28         $(document).ready(function() {        
29             $('input[type="button"]').click(function() {
30                 var len = $('#myTable tr').length;
31                 var temp = (len === 1) ? 'A' : $('#myTable tr:last td:first').html();
32                 var next = String.fromCharCode(parseInt(temp.charCodeAt() + 1));
33                 var sign = temp.charCodeAt() || 'hyy';
34                 var _obj = new Obj(next, sign);
35                 var _temp = '<tr><td>' + _obj.sort + '</td><td>' + _obj.sign + '</td><td>' + _obj.del + '</td></tr>'
36                 arr.push(_obj);
37                 $('#myTable').append(_temp);
38                 
39                 $('#myTable tr:last a ').on('click', function() {
40                     $(this).parent().parent().remove();
41                     var temp = $(this).parent().parent().find('td:first').html();
42                     var _index = parseInt(temp.charCodeAt() - 65);
43                     arr.splice(_index, 1);
44                     sortTable();
45                 });
46                 
47                 sortTable();
48                 
49             });
50         }); 
51         
52         function  Obj(sort, sign) {
53             this.sort = sort;
54             this.sign = sign;
55             this.del = '<a>删除</a>';
56         }
57         
58         function sortTable() {
59             $.each($('#myTable tr').not(':first'), function(index, value, full) {
60                 var temp = String.fromCharCode(65 + index);
61                 $(this).find('td:first').html(temp);
62                 if(arr[index] && arr[index]["sort"]) {
63                     arr[index]["sort"] = temp;
64                 }
65             })
66         }
67     
68     </script>
69     
70     <body>
71         <div>
72             <table id="myTable" >
73                 <tr >
74                     <td>TEST</td>
75                 </tr>
76             </table>
77         </div>
78         <input type="button" value="ADD" />
79     </body>
80 </html>
原文地址:https://www.cnblogs.com/maduar/p/5327512.html