JS动态增加,删除表单组件

最近做一个应用,需要自定义表单.做了个简单的JS控制增加表格中的一行或删除一行


贴源码如下:

<script language="javascript">

function delChild(id){ 
	var table = document.getElementById("Table1");
	var bb=table.getElementsByTagName("tr");
	 for(var i=0; i<bb.length; i++){
		 if(bb[i].d==id) break;
	 }
	table.deleteRow(i);
} 

var oa=0;//定义全局函数
function tbladdrow(){

    oa++;
	var Table1 = document.getElementById("Table1");
	var i=Table1.rows.length;
	if(i>=4){
alert("最多只能添加四条.");
	return;
	}
	row = Table1.insertRow(Table1.rows.length);
    row.d=oa;
	var col = row.insertCell(0);
	col.innerHTML = "<div align='center'><INPUT name=fname"+i+" value="+i+" SIZE=10></div>";
	col = row.insertCell(1);
	col.innerHTML = "<INPUT name=fvalue"+i+"><input type= button  value=删除 onclick=delChild("+oa+") />";	
}

function tbladdrows(items){
 for(var i =0 ; i < items; i++){
	  tbladdrow();
	 }
}

</script>
<table id="Table1" >
<TBODY id="lines">	   	
	   	
	   	</TBODY> 
		
		</table> 

 <input onclick="tbladdrows(this.shu);" type="button" shu="1" value="添加一项" name="insert"/>

 

评论

1 楼 lxh2002 2010-03-14  

非常感谢，我也在做一个类似的东西，帮了一个大忙了！