如何删除表格中间插入行
function addRow(obj) {
var num = obj.value; //num是提交的件数
var beginRow = obj.parentElement.parentElement.rowIndex;
var theTable = document.getElementById("fillTbl");
var dRow = document.getElementsByTagName("tr");
//alert(dRow.length);
if (dRow.length>0) {
for (var j=0; j <dRow.length; j++) {
if ("addCls" == dRow[j].name||"addClass" == dRow[j].className) {
theTable.deleteRow(dRow[j].rowIndex);
}
}
}
dRow = document.getElementsByTagName("td");
if (dRow.length>0) {
for (j=0; j <dRow.length; j++) {
if ("addCls" == dRow[j].name) {
theTable.deleteRow(dRow[j].parentElement.rowIndex);
}
}
}
dRow = document.getElementsByTagName("font");
if (dRow.length>0) {
for (j=0; j <dRow.length; j++) {
if ("addCls" == dRow[j].name) {
theTable.deleteRow(dRow[j].parentElement.parentElement.rowIndex);
if ("tr" == dRow[j].parentElement.parentElement.parentElement.tagName) {
//alert(dRow[j].parentElement.parentElement.parentElement.tagName);
theTable.deleteRow(dRow[j].parentElement.parentElement.parentElement.rowIndex);
}
}
}
}
var cellidx;
var newCell;
var newRow;
if (num>1) {
for (var i=num; i>=1; i--) {
// append new row to the end of the table
newRow = theTable.insertRow(beginRow+1); //theTable.rows.length);
// give the row its own ID
newRow.id = newRow.uniqueID;
newRow.name = "addCls"; // 为了修改件数可以删除添加的行，我用addCls作为name识别
newRow.className = "addClass"; //同样是为了删除下面添加的行，因为有2行就是删不掉
cellidx=0;
// an inserted row has no cells, so insert the cells
newCell = newRow.insertCell(cellidx);
newRow.bgcolor="#E7EDF5";
newRow.colspan="5";
// give this cell its own id
newCell.name = "addCls";
// display the row’s id as the cell text
newCell.align="center";
newCell.colspan="5";
newCell.bgcolor="#E7EDF5";
newCell.innerHTML = " <font name='addCls' color='#2D486C'>第"+i+"件的信息 </font>";
newRow = theTable.insertRow(beginRow+2); //theTable.rows.length);
newRow.className = "addClass";
newRow.id = newRow.uniqueID;
newRow.name = "addCls";
cellidx = 0;
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.innerHTML =" <img src='image/weight.jpg'>";
cellidx++;
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.innerHTML =" <input type='text' name='weightPart[]'>";
cellidx++;
newCell.TagName = "td";
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.innerHTML =" <img src='image/volume.jpg'>";
cellidx++;
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.colspan = "2";
newCell.innerHTML =" <input size='36' type='text' name='volPart[]'>";
newRow = theTable.insertRow(beginRow+3); //theTable.rows.length);
newRow.className = "addClass";
newRow.id = newRow.uniqueID;
cellidx = 0;
newRow.name = "addCls";
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.innerHTML =" <img src='image/descriptionEn.jpg'>";
cellidx++;
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.innerHTML =" <input type='text' name='dEnPart[]'>";
cellidx++;
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.id = newCell.uniqueID;
newCell.innerHTML =" <img src='image/descriptionChn.jpg'>";
cellidx++;
newCell = newRow.insertCell(cellidx);
newCell.name = "addCls";
newCell.colspan = "2";
newCell.innerHTML =" <input size='36' type='text' name='dChnPart[]'>";
}
}
}
newRow = theTable.insertRow(beginRow+1); //theTable.rows.length); // give the row its own ID newRow.id = newRow.uniqueID; newRow.name = "addCls"; newRow.className = "addClass"; cellidx=0; // an inserted row has no cells, so insert the cells newCell = newRow.insertCell(cellidx); newRow.bgcolor="#E7EDF5"; newRow.colspan="5"; // give this cell its own id newCell.name = "addCls"; // display the row’s id as the cell text newCell.align="center"; newCell.colspan="5"; newCell.bgcolor="#E7EDF5"; newCell.innerHTML = "<font name='addCls' color='#2D486C'>第"+i+"件的信息</font>";
<form name="form1" method="post" action="insert.php"><table border="1" cellspacing="0" id="fillTbl"><tr> <td><img src="image/destination.jpg"></td> <td><input name="destination" type="text" id="destination" value="<?PHP if (1==$label){ echo mysql_result($result,0,"destination"); } ?>"></td> <td><font size=2>是否一票多件(如果是请选择件数,并填写每件的信息)</font></td> <td colspan="2"><input type="radio" name="mul" id="mulY" value="Yes"> <label for="mulY">Yes</label> <input type="radio" name="mul" id="mulN" value="No" checked> <label for="mulN">No</label><font size=2 color="#CC3366"> 件数：</font> <select name="pNum" onchange="addRow(this)"> <option value="1" selected>1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </td></tr><tr><td>这里还有几行，插入的行在中间位置，所以不能从表格末尾删除。</td></tr></table>
[Quote=引用:]select的选择值改变，如何记录上一次选的值呢？如果知道就好办，大家出出主意，3Q[/Quote]你在页面定义一个变量就可以了．var rowinsert=0;function addRow(obj) { var num = obj.value; //num是提交的件数 var beginRow = obj.parentElement.parentElement.rowIndex; var theTable = document.getElementById("fillTbl"); var dRow = document.getElementsByTagName("tr"); insertrow = num - rowinsert//取得要插入或删除的行数 rowinsert = num //记录新选择的值供下次使用 if(insertrow==0)return //如果没变化则返回 if(insertrow<0){ //小于0即删除，则从num开始删除Math.abs(insertrow)行 for(i=num;i<(num+Math.abs(insertrow));i++) theTable.deleteRow(i) }else{ //大于0即插入,从num-insertrow开始插入insertrow行 for(i=num-insertrow;i<num;i++) //执行插入 }}