动态表格,点击按钮添加或删除一行
<!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<script language='JavaScript'>
var listNum=1;
//新增一行
function add_Row()
{
var Htmltable=document.getElementById("listtable");
listNum++;
var Htmlrow=Htmltable.insertRow();//新增一行
var Htmlcell=Htmlrow.insertCell();//新增一列
Htmlcell.align="left";
Htmlcell.className="tablehead2";
Htmlcell.innerHTML="第"+listNum+"行";
Htmlcell=Htmlrow.insertCell();//新增第二列
Htmlcell.innerHTML="<input name='text"+listNum+"' id='text"+listNum+"' type='text' style='width: 150px'/>";
Htmlcell=Htmlrow.insertCell();//新增第三列
Htmlcell.innerHTML="<a οnclick='delete_Row(this)'>删除</a>";
}
//删除某一行
function delete_Row(deleteRow)
{
var Htmltable=document.getElementById("listtable")
if(window.confirm("你确定要删除该行数据吗?")==true){
Htmltable.deleteRow(deleteRow.parentElement.parentElement.rowIndex);
}
}
//检查某行的input值是否为空
function check_input()
{
var Htmltable=document.getElementById("listtable");
for(var y=0;y<Htmltable.rows.length;y++)
{
var H_row=Htmltable.rows[y];
var inputName=H_row.getElementsByTagName("input");
if(inputName[0].value==null || inputName[0].value.length==0)
{
var aValue=Htmltable.rows[y].cells[0].innerHTML;
alert(aValue+"不能为空");
return false;
}
}
}
</head>
<body>
<table id="listtable">
<tr>
<td width="20%" align="left" class="tablehead2">第一行</td>
<td width="55%"><input name="text1" id="text1" type="text" style="width: 150px"/></td>
<td width="25%"><a οnclick="delete_Row(this)">删除</a></td>
</tr>
</table>
</body>
</html>
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
