js动态添加删除表格

<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/ 。。。。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值