`

js动态添加表格

阅读更多
  1. <script type="text/javascript">   
  2.         //全局变量   
  3.         var i=0;   
  4.         //添加行   
  5.         function addMyRow(){   
  6.             var mytable = document.getElementById("mybody");   
  7.             var mytr = mytable.insertRow();   
  8.             mytr.setAttribute("id","tr"+i);   
  9.             var mytd_1=mytr.insertCell();   
  10.             var mytd_2=mytr.insertCell();   
  11.             var mytd_3=mytr.insertCell();   
  12.             var mytd_4=mytr.insertCell();   
  13.             var mytd_5=mytr.insertCell();   
  14.             mytd_1.innerHTML="<input type='text' name='myname"+i+"'/>";   
  15.             mytd_2.innerHTML="<input type='radio' name='mysex"+i+"' value='1'/>男<input type='radio' name='mysex"+i+"' value='2'/>女";   
  16.             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'/>游泳";   
  17.             mytd_4.innerHTML="<select name='myjg"+i+"'><option value='1'>北京</option><option value='2'>河北</option><option value='3'>天津</option></select>";   
  18.             mytd_5.innerHTML="<input type='button' value='删除' onclick=\"delMyRow('"+i+"')\"/>";   
  19.             i++;   
  20.         }   
  21.         //删除当前行   
  22.         function delMyRow(j){   
  23.             var mytable = document.getElementById("mybody");   
  24.             var myrow = document.getElementById("tr"+j);   
  25.             mytable.deleteRow(myrow.rowIndex-1);   
  26.         }   
  27.         //删除所有行   
  28.         function delAllMyRow(){   
  29.             var mytable = document.getElementById("mybody");   
  30.             var rowlen=mytable.rows.length;   
  31.             for(var i=rowlen-1;i>=0;i--){   
  32.                 mytable.deleteRow(i);   
  33.             }   
  34.         }   
  35.         </script>  

 

 

 

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics