动态增删表

王朝other·作者佚名  2006-01-09
窄屏简体版  字體: |||超大  

前台页面page1.html:

<FORM action="Page2.asp" method=POST id="form1">

<table id="myTable">

<tr >

<td id="myTd1">

<INPUT type="text" name="text1">内容

</td>

</tr>

</table>

<br/>

<button onclick="doAdd();" >AddRow</button>

<button onclick="doDel();" >DelRow</button>

<button onclick="form1.submit();">OK!</button>

</FORM>

<script>

var i=0;

function doAdd()

{

i=i+1;

var nowTable=document.all.myTable;

var newTr=nowTable.insertRow(i);

var newTd=newTr.insertCell(0);

newTd.innerHTML =myTd1.innerHTML;

//假设名字是随便取的

newTd.getElementsByTagName("INPUT")[0].setAttribute("name","text" + parseInt( Math.random() * 100));

//可以用下面这行测试新名字

alert( newTd.getElementsByTagName("INPUT")[0].getAttribute("name"));

//getAttribute("name"));

}

function doDel()

{

if(i>=1)

{

document.all.myTable.rows(i).removeNode();

i=i-1;

}

else

{

alert("不能全删光!");

}

}

</script>

后台页面page2.asp:

<%

for each myInput in Request.Form

Response.Write myInput

Response.Write "="

Response.Write Request(myInput)

Response.Write "<br/>"

next

%>

<table id="idTB" border=1>

<tr id="idTR">

<td>First row</td>

</tr>

</table>

<input type="button" onclick="addRow();" value="加一行">

<br/>

<input type="button" onclick="RemoveRow();" value="减一行">

<script language="javascript">

function addRow()

{

oTR=idTB.insertRow(idTB.rows.length);

oTD=oTR.insertCell(0);

oTD.innerText="New Row " + oTR.rowIndex;

}

function RemoveRow()

{

oTR=idTB.rows(idTB.rows.length-1);

oTR.removeNode(true);

}

</script>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航