<html >
<head>
<title>动态添加Table行</title>
<script type="text/javascript">
function AddNewRow()
{
var row_index= document.getElementById("hidItemList").value;
var new_row=Table1.insertRow(Table1.rows.length);
new_row.setAttribute("id", "row"+row_index);
new_row.setAttribute("align", "center");
var new_col=new_row.insertCell(0);
new_col.innerHTML="<span id='spanID"+row_index+"'>用户ID"+row_index+"</span>";
var new_col=new_row.insertCell(1);
new_col.innerHTML="<span id='spanItem"+row_index+"'>用户名"+row_index+"</span>";
var new_col=new_row.insertCell(2);
new_col.innerHTML="<input type='text' name='txtMATNR"+row_index+"' style='width: 90px' >";
var new_col=new_row.insertCell(3);
new_col.innerHTML=" <span id='spanGG"+row_index+"'></span>";
var new_col=new_row.insertCell(4);
new_col.innerHTML="<input type='button' value='删除此行' name='btnDel"+row_index+"' style='width: 60px' οnclick=/"delete_row('row"+row_index+ "')/">";
document.getElementById("hidItemList").value = parseInt(row_index)+1;
}
function delete_row(rname)
{
var i;
i=Table1.rows(rname).rowIndex;
Table1.deleteRow(i);
}
</script>
</head>
<body>
<table border="1" width="600px" id="Table1">
<tr align="center">
<td>用户ID</td>
<td>用户名</td>
<td>性别</td>
<td>年龄</td>
<td>删除</td>
</tr>
</table>
<input id="新增Item" type="button" value="button" οnclick="AddNewRow()"/>
<input id="hidItemList" type="hidden" value="1"/>
</body>
</html>
动态添加Table行
最新推荐文章于 2021-11-09 17:25:43 发布