欢迎访问:常州市武进区嘉泽中心小学网站 !今天是:
栏目列表
您现在的位置是:首页>>教师>>计算机技术>>网站制作技术>>文章内容
动态增删表
发布时间:2008-11-20   点击:   来源:本站原创   录入者:佚名
 

前台页面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>


附件:
    关闭窗口
    打印文档
    账号登录
    保持登录 忘记密码?
    账号与武进教师培训平台同步