求页面高手-动态表格

wby13579 2011-08-08 02:39:21

一个表格假设3行3列

<tr id="第二行">
<td></td>
<td></td>
<td id="第二行第三列"></td>
</tr>

想通过按钮，对第二行第三列（第三个ID）进行添加和删除一个三行三列的表格。

...全文

74 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

softroad 2011-08-08

打赏
举报

啥需求啊，没搞明白就贴代码了

Spring89 2011-08-08

打赏
举报

var newrowpic = uploadtb.insertRow(row);//在表格的第row行添加新行，uploadtb为表格ID
newrowpic.insertCell();//调用一次添加一列，一般为左右两列，既要调用两次
//===设置列的相关属性====
newrowpic.cells[0].height="36";
newrowpic.cells[0].align="right";
newrowpic.cells[0].bgColor="#f5f5f5";
newrowpic.cells[0].innerHTML = "名字：";
newrowpic.cells[1].bgColor="#FFFFFF";
newrowpic.cells[1].innerHTML = "<input type='file' name='pic_"+length+"' onchange='checkImg(this,"+length+")' id='pic' style='width:400px; font-size:12px; height:20px;' />";
newrowpic.cells[1].innerHTML += " <input type='button' name='button' id='btnDel' value='删除' onclick='deletePic("+length+")'/><br>";

// 要删除的第row行
document.all.uploadtb.deleteRow(row);

Fee_ 2011-08-08

打赏
举报



<html>  

 <head>  

  <title>Adding and Removing Rows from a table using DHTML and JavaScript</title>  

  <script language="javascript">  

    function addRow()  

   {  

     var newRow = document.all("tblGrid").insertRow();  

  

  //得到表的对象并插入一行，下面是插入了行以后，填充相应的列节点，如下面所示  

     var oCell = newRow.insertCell();//插入列的节点  

     oCell.innerHTML = "<input type='text' name='t1'>";//列里面填充的值，innerHtml值列内的所有元素      

    oCell = newRow.insertCell();  

    oCell.innerHTML = "<input type='text' name='t2'>";  

     

    oCell = newRow.insertCell();  

    oCell.innerHTML = "<input type='text' name='t3'>   <input type='button' value='Delete' onclick='removeRow(this);'/>";    

   }  

   function removeRow(src)  

   {  

    var oRow = src.parentElement.parentElement;  //获取当前事件的父节点  

    document.all("tblGrid").deleteRow(oRow.rowIndex);  //删除当前列  

   }  

   

  </script>  

 </head>  

 <body>  

    <table id="tblGrid" style="table-layout:fixed">  

   <tr>  

    <td width="150px">编号</td>  

    <td width="150px">姓名</td>  

    <td width="250px">年龄</td>  

   </tr>  

    

  </table>  

  <hr>  

  <input type="button" value="增 加 行" onClick="addRow();" />  

   </body>  

</html>

看了这个实例，你应该会了吧，LZ不要吝啬哦

wanjing13 2011-08-08

打赏
举报

现在单元格中套一表格然后看下面，应该会有帮助吧！
<html>
<script type="text/javascript">
function b(){
var myTable = document.getElementById("myTable");
for(var j = 0; j < 3; j++){ //三行
var rows = myTable.insertRow(j);
var cell = rows.insertCell(0);
var cell1 = rows.insertCell(1);
var cell2 = rows.insertCell(2); //三列
cell.innerHTML = "aaaa";
cell1.innerHTML = "aaaa";
cell2.innerHTML = "aaaa";
}
}

function deleteTableRow(){
var myTable = document.getElementById("myTable");
var rowsCount = myTable.rows.length;
alert(rowsCount);
for(var i = rowsCount - 1; i >0; i--){
myTable.deleteRow(i);
}
}
</script>
<body>
<form>
<input type="button" onclick="b();" value="aaa"/>
<input type="button" onclick="deleteTableRow();" value="bbb"/>
<table id="myTable" border=1>
</table>
<div id="myDiv">
</div>
</form>
<body>
</html>

softroad 2011-08-08