js新增一行，删除所有行，删除某一行

PlayIT1024

浏览: 21179 次
性别:
来自: 泉州

最近访客更多访客>>

wang_clark

xray2100

myde

孤傲苍狼

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

QQ HTML

  <script>
  function rowsAdd(){
	 var Container = document.getElementById("play");
	 var detailNum = Container.rows.length;
 	 //var _table=document.getElementById("takesheetspec");
 	 var _tr=Container.insertRow(-1);
 	 //alert(_tr.rowIndex);
 	 var _id='pd'+detailNum;
 	 for(var i=0;i<8;i++)
 	  {
 	   var _td=_tr.insertCell(i);
 	   _tr.id=_id;	
 	    switch(i)
 	     {
 	      case 0:
 	      	 _td.id="cell"+detailNum;
 	         _td.innerHTML=detailNum+"<a href='#' name='delete' onclick=tabledel("+detailNum+")>删除</a>";
 	         break;
 	      case 1:
 	         _td.innerHTML="<input type='text' size='7'>";  
 	         break;
 	      case 2:
 	         _td.innerHTML="<input type='text' size='7'>";  
 	         break;
 	      case 3:
 	         _td.innerHTML="<input type='text' size='7'>";  
 	         break;
 	      case 4:
 	        _td.innerHTML="<input type='text' size='7'>";  
 	         break;   
 	      case 5:
 	          _td.innerHTML="<input type='text' size='7'>";  
 	         break;
 	      case 6:
 	         _td.innerHTML="<input type='text' size='7'>";  
 	         break; 
 	      case 7:
 	         _td.innerHTML="<input type='text' size='7'>";  
 	         break; 
		 case 8:
		     _td.innerHTML="<input type='text' size='7'>";  
		 break;
 	     }
 	  }  	 
}
function tabledel(row)
{
	var Container = document.getElementById("play");		
		//alert(document.getElementById('index').value);	
		var _tr=document.getElementById("pd"+row);	
		row=_tr.rowIndex;
		Container.deleteRow(row);	
		var LastTrIndex = Container.rows.length;
		//var afterDel=row-1;
		row+=1;
		for(row;row<=LastTrIndex;row++) {
			var _td=document.getElementById("cell"+row);	
			var _tr=document.getElementById("pd"+row);	
			var newRow=_tr.rowIndex;
			_tr.id='pd'+newRow;
			_td.id="cell"+newRow;
			_td.innerHTML=newRow+"<a href='#' name='delete' onclick=tabledel("+newRow+")>删除</a>";
		}
}
function tabAllDel() 
{
var Container = document.getElementById("play");
Container.firstChild.removeNode(true);
//增加一行
var tr=Container.insertRow(-1);
var  cell  =  tr.insertCell(0);   
cell.innerHTML = "&nbsp;";
cell  =  tr.insertCell(1);   
cell.innerHTML = "姓名";   
cell  =  tr.insertCell(2);   
cell.innerHTML = "性别"; 
cell  =  tr.insertCell(3);   
cell.innerHTML = "年龄"; 
cell = tr.insertCell(4); 
cell.innerHTML = "QQ"; 
cell = tr.insertCell(5); 
cell.innerHTML = "MSN"; 
cell= tr.insertCell(6); 
cell.innerHTML = "E-mail";    
cell= tr.insertCell(7); 
cell.innerHTML = "备注";       
}
  </script>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
 </HEAD>
 <BODY> 
 <a href="#" onclick="rowsAdd()">新增行</a>
  <a href="#" onclick="tabAllDel()">删除所有行</a>
  <table id="play">
	<tr>
		<td>&nbsp;</td>
		<td>姓名</td>
		<td>性别</td>
		<td>年龄</td>
		<td>QQ</td>
		<td>MSN</td>
		<td>E-mail</td>
		<td>备注</td>
	</tr>
  </table>
 </BODY>
</HTML>

分享到：