本文将介绍一下,如何用Jquery MiniUi动态添加一行table表格

1.效果展示


MiniUI动态添加table表格

                 ↓

MiniUI动态添加table表格

2.具体代码


 1     <script type="text/javascript">
 2         function addRow() {
 3             var form = document.getElementById("addForm");
 4             var table = document.getElementById("table_Records");
 5             var id_com = form.getElementsByTagName("input")[0].value;
 6             var id_txtOne = form.getElementsByTagName("input")[2].value;
 7             var id_txtTwo = form.getElementsByTagName("input")[4].value;
 8             var i = table.rows.length - 1;
 9             var tr = table.insertRow();
10             tr.style.cssText = table.rows[0].style.cssText;
11             tr.insertCell(0).innerHTML = parseInt(table.rows[i].cells[0].innerHTML) + 1;
12             tr.insertCell(1).innerHTML = id_txtOne;
13             tr.insertCell(2).innerHTML = parseInt(id_txtOne) + parseFloat(table.rows[i].cells[2].innerHTML);
14             tr.insertCell(3).innerHTML = id_com;
15             tr.insertCell(4).innerHTML = "2.6";
16             tr.insertCell(5).innerHTML = id_txtTwo;
17             tr.insertCell(6).innerHTML = parseInt(id_txtTwo) + parseFloat(table.rows[i].cells[6].innerHTML);
18         }
19     </script>
Javascript

相关文章: