动态表格的实现
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE>动态表格</TITLE><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""><script type="text/javascript">function addOneRow(){//判断是否传入足够参数 if(arguments.length <= 1 ){return "error"; } try{//获取table句柄var tb=document.getElementById(arguments);//添加一行var newTr = tb.insertRow();for(var i=1 ;i < arguments.length;i++){ //添加一列 var newTd = newTr.insertCell(); newTd.innerHTML = arguments; } }catch (e) {return e.toString(); } return "true";}function deleteOneRow(){//判断是否传入足够参数 if(arguments.length == 0){return "error"; } var thisTag = arguments; try{//获取句柄var obj = getThisObj(thisTag); //寻找最靠近的tablewhile (obj.nodeName.toUpperCase() != 'TABLE'){ obj =obj.parentElement; } //删除一行var newTr = obj.deleteRow(getTrRowOfTable(thisTag));}catch (e) {return e.toString(); } return "true";}function getTableMaxRow(){ //判断是否传入足够参数 if(arguments.length == 0 ){return "error"; } try{//获取句柄var obj = getThisObj(arguments); //寻找最靠近的tablewhile (obj.nodeName.toUpperCase() != 'TABLE'){ obj =obj.parentElement; }return obj.rows.length; }catch (e) {return e.toString(); }}function getTrRowOfTable(){ //判断是否传入足够参数 if(arguments.length == 0 ){return "error"; } try{//获取传入标签的句柄var obj = getThisObj(arguments); //寻找最靠近的TRwhile (obj.nodeName.toUpperCase() != 'TR'){ obj =obj.parentElement; }//返回TR的行号 return obj.rowIndex; }catch (e) {//返回异常信息return e.toString(); }}//获取指定标签的句柄function getThisObj(){ var obj; //若定义了id if(arguments.id != ""){obj=document.getElementById(arguments.id);return obj; }//若定义了name if(arguments.name != ""){//通过name取句柄得到的是个数组，所以必须保证该name页面唯一obj=document.getElementsByName(arguments.name); return obj; }}function showInfo(){ //显示本行号 alert("当前行号为："+ getTrRowOfTable(arguments)); //显示总行数 alert("总行数为："+ getTableMaxRow(arguments));}var rowId=1;function addRow(){ var tagStr="<input type=text value=ccc name="+rowId+" onclick='addRow();showInfo(this)' onchange='deleteOneRow(this);'>"; addOneRow("tb",tagStr); rowId++;}</script></HEAD><BODY > <table id="tb"></table></BODY></HTML>
页:
[1]