这篇文章介绍了js动态给table添加/删除tr的方法
有需要的朋友可以参考一下
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "
//W
C//DTD HTML
Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript">// Example: obj = findObj("image
");
function findObj(theObj
theDoc)
{
var p
i
foundObj;
if(!theDoc) theDoc = document;
if( (p = theObj
indexOf("?")) >
&& parent
frames
length)
{ theDoc = parent
frames[theObj
substring(p+
)]
document; theObj = theObj
substring(
p); } if(!(foundObj = theDoc[theObj]) && theDoc
all) foundObj = theDoc
all[theObj]; for (i=
; !foundObj && i < theDoc
forms
length; i++) foundObj = theDoc
forms[i][theObj]; for(i=
; !foundObj && theDoc
layers && i < theDoc
layers
length; i++) foundObj = findObj(theObj
theDoc
layers[i]
document); if(!foundObj && document
getElementById) foundObj = document
getElementById(theObj); return foundObj;
}
//添加一个参与人填写行
function AddSignRow(){ //读取最后一行的行号
存放在txtTRLastIndex文本框中
var txtTRLastIndex = findObj("txtTRLastIndex"
document);
var rowID = parseInt(txtTRLastIndex
value);
var signFrame = findObj("SignFrame"
document);
//添加行
var newTR = signFrame
insertRow(signFrame
rows
length);
newTR
id = "SignItem" + rowID;
//添加列:序号
var newNameTD=newTR
insertCell(
);
//添加列内容
newNameTD
innerHTML = newTR
rowIndex
toString();
//添加列:姓名
var newNameTD=newTR
insertCell(
);
//添加列内容
newNameTD
innerHTML = "<input name=
txtName" + rowID + "
id=
txtName" + rowID + "
type=
text
size=
/>";
//添加列:电子邮箱
var newEmailTD=newTR
insertCell(
);
//添加列内容
newEmailTD
innerHTML = "<input name=
txtEMail" + rowID + "
id=
txtEmail" + rowID + "
type=
text
size=
/>";
//添加列:电话
var newTelTD=newTR
insertCell(
);
//添加列内容
newTelTD
innerHTML = "<input name=
txtTel" + rowID + "
id=
txtTel" + rowID + "
type=
text
size=
/>";
//添加列:手机
var newMobileTD=newTR
insertCell(
);
//添加列内容
newMobileTD
innerHTML = "<input name=
txtMobile" + rowID + "
id=
txtMobile" + rowID + "
type=
text
size=
/>";
//添加列:公司名
var newCompanyTD=newTR
insertCell(
);
//添加列内容
newCompanyTD
innerHTML = "<input name=
txtCompany" + rowID + "
id=
txtCompany" + rowID + "
type=
text
size=
/>";
//添加列:删除按钮
var newDeleteTD=newTRinsertCell();
//添加列内容
newDeleteTDinnerHTML = "<div align=center style=width:px><a #" + rowID + ")">删除</a></div>";
//将行号推进下一行
txtTRLastIndexvalue = (rowID + )toString() ;
}
//删除指定行
function DeleteSignRow(rowid){
var signFrame = findObj("SignFrame"document);
var signItem = findObj(rowiddocument);
//获取将要删除的行的Index
var rowIndex = signItemrowIndex;
//删除指定Index的行
signFramedeleteRow(rowIndex);
//重新排列序号如果没有序号这一步省略
for(i=rowIndex;i<signFramerowslength;i++){
signFramerows[i]cells[]innerHTML = itoString();
}
}//清空列表
function ClearAllSign(){
if(confirm(确定要清空所有参与人吗？)){
var signFrame = findObj("SignFrame"document);
var rowscount = signFramerowslength;
//循环删除行从最后一行往前删除
for(i=rowscount ;i > ; i){
signFramedeleteRow(i);
}
//重置最后行号为
var txtTRLastIndex = findObj("txtTRLastIndex"document);
txtTRLastIndexvalue = "";
//预添加一行
AddSignRow();
}
}
</script>
</HEAD>
<BODY>
<div>
<table width="" border="" cellpadding="" cellspacing="" id="SignFrame">
<tr id="trHeader">
<td width="" bgcolor="#EE">序号</td>
<td width="" bgcolor="#EE">用户姓名</td>
<td width="" bgcolor="#EE">电子邮箱</td>
<td width="" bgcolor="#EE">固定电话</td>
<td width="" bgcolor="#EE">移动手机</td>
<td width="" bgcolor="#EE">公司名称</td>
<td width="" align="center" bgcolor="#EE"> </td>
</tr>
</table>
</div>
<div>
<input type="button" name="Submit" value="添加参与人" />
<input type="button" name="Submit" value="清空" />
<input name=txtTRLastIndex type=hidden id=txtTRLastIndex value="" />
</div>
</BODY>
</HTML>
