论坛首页 Web前端技术论坛

javaScirpt 动态在table 插入行

浏览 2006 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2011-10-28  
   最近在工作的时候,遇到动态的向table 中添加行数据,
javaScript  代码:

1:添加动态行函数:

  function addRow(){
   ++rowIndex; //全局变量,用于记录增加行的标志,以便与数据输入信息的统计
   var table_id = document.getElementById("table1")// table1:表示要实现动态添加行
                                                 // table 的ID  值
   var new_row = table_id.insertRow(table_id.rows.length);//
                                      table_id.rows.length:表示:id为table1已经存在的行数
       new_row.setAttribute("id","row"+rowIndex);//设置新行 id
   var new_col=new_row.insertCell(0);//设置新添加行中的一列,以0开始
    new_col.width="8%";
    new_col.innerText="xxx";
    var new_col=new_row.insertCell(1);
     new_col.width="11%";
    new_col.innerHTML="<input type='text'      style='width:80%' 
                  id='xxxxx"+rowIndex+"'
               name='xxxxx"+rowIndex+"' > 
  
   }
2:删除新添加的一行数据:
  function delete_row(re){
var i;
var docu = document.getElementById("table1");
i = docu.rows(re).rowIndex;
docu.deleteRow(i);

}
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics