js删除行出现问题
我要进行添加删除行。添加行没有问题。但是删除行因为该图案前三行,是从数据库读取的,所以删除操作上有些问题。
列名,列数都是从数据库读取的。现在就是根据rowIndex删除行,删除的不是指定的一行。因为前三行不是增加出来的,是数据库读取出来的。如何将前三行和添加的行融合在一起。删除一行后,行号变化。永远是从1.2..以此类推。
function $(id)
{
return document.getElementById(id);
}
var rowIndex=0;
function addRow(cellLength)
{
if(rowIndex==0)
{
var rowsNum=document.getElementsByName("rowNum");
rowIndex=rowsNum[rowsNum.length-1].value;
}
rowIndex++;
var table=$("table1");
var newTr=table.insertRow();
var beginCell=newTr.insertCell();
beginCell.align="center";
beginCell.innerHTML=rowIndex+"<input type='hidden' name='rowNum' value="+rowIndex+">";
for(i=0;i<cellLength;i++){
var cell=newTr.insertCell();
cell.align="center";
cell.innerHTML="<input type='text' name='column"+i+"'>";
}
var endCell=newTr.insertCell();
endCell.align="center";
endCell.innerHTML="<input type='button' value='删除' onclick='delRow("+rowIndex+")'>";
}
function delRow(rowNumber){
alert(rowNumber);
var table=$("table1");
table.deleteRow(rowNumber);
rowIndex--;
}
[解决办法]
每删除一行完成时:
$('#tabId>tr>td:first').each(function(i){$(this).text(i+1);})
[解决办法]
楼主 最好把demo 精简整理下 再贴出来。
[解决办法]
最笨的方法:重写每一行(遍历每一行)
[解决办法]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript">function delRow() { var index = document.getElementById('rowNo').value; var obj = document.getElementById('demo'); obj.deleteRow(index); //重新计算第一列序号 obj = obj.getElementsByTagName('tr'); for (var i = 1; i < obj.length; i ++) obj[i].getElementsByTagName('td')[0].innerHTML = i;}</script></head><body><table width="500" border="1" id="demo"> <tr> <td>序号</td> <td>COL1</td> <td>COL2</td> <td>COL3</td> <td>COL4</td> <td>COL5</td> </tr> <tr> <td>1</td> <td>R1C1</td> <td>R1C2</td> <td>R1C3</td> <td>R1C4</td> <td>R1C5</td> </tr> <tr> <td>2</td> <td>R2C1</td> <td>R2C2</td> <td>R2C3</td> <td>R2C4</td> <td>R2C5</td> </tr> <tr> <td>3</td> <td>R3C1</td> <td>R3C2</td> <td>R3C3</td> <td>R3C4</td> <td>R3C5</td> </tr> <tr> <td>4</td> <td>R4C1</td> <td>R4C2</td> <td>R4C3</td> <td>R4C4</td> <td>R4C5</td> </tr> <tr> <td>5</td> <td>R5C1</td> <td>R5C2</td> <td>R5C3</td> <td>R5C4</td> <td>R5C5</td> </tr></table><label for="rowNo">行号:</label><input type="text" id="rowNo" /><input type="button" onclick="delRow();" value="DEL" /></body></html>