<script type="text/javascript"> //全局变量 var i=0; //添加行 function addMyRow(){ var mytable = document.getElementById("mybody"); var mytr = mytable.insertRow(); mytr.setAttribute("id","tr"+i); var mytd_1=mytr.insertCell(); var mytd_2=mytr.insertCell(); var mytd_3=mytr.insertCell(); var mytd_4=mytr.insertCell(); var mytd_5=mytr.insertCell(); mytd_1.innerHTML="<input type='text' name='myname"+i+"'/>"; mytd_2.innerHTML="<input type='radio' name='mysex"+i+"' value='1'/>男<input type='radio' name='mysex"+i+"' value='2'/>女"; mytd_3.innerHTML="<input type='checkbox' name='mylove"+i+"' value='1'/>上网<input type='checkbox' name='mylove"+i+"' value='2'/>篮球<input type='checkbox' name='mylove"+i+"' value='3'/>游泳"; mytd_4.innerHTML="<select name='myjg"+i+"'><option value='1'>北京</option><option value='2'>河北</option><option value='3'>天津</option></select>"; mytd_5.innerHTML="<input type='button' value='删除' οnclick=\"delMyRow('"+i+"')\"/>"; i++; } //删除当前行 function delMyRow(j){ var mytable = document.getElementById("mybody"); var myrow = document.getElementById("tr"+j); mytable.deleteRow(myrow.rowIndex-1); } //删除所有行 function delAllMyRow(){ var mytable = document.getElementById("mybody"); var rowlen=mytable.rows.length; for(var i=rowlen-1;i>=0;i--){ mytable.deleteRow(i); } } </script>
<input type="button" value="添加" οnclick="addMyRow();"><input type="button" value="删除所有" οnclick="delAllMyRow();">
<table border="1">
<thead>
<tr bgcolor="red">
<td align="center">
姓名
</td>
<td align="center">
性别
</td>
<td align="center">
爱好
</td>
<td align="center">
籍贯
</td>
<td align="center">
操作
</td>
</tr>
</thead>
<tbody id="mybody">
</tbody>
</table>
转载于 http://zhou-hong-liang.iteye.com/ 。。。。