如何在Javascript中删除一行

How to delete a row in Javascript?

本文关键字：一行 删除 Javascript      更新时间：2023-09-26

我已经在Javascript中动态添加/删除了行，添加行没有问题，只是删除行有问题。目前，我所做的是，当我想删除一行时，它总是删除最后一行，所以我认为I want if it only can be deleted the selected row，我不知道如何将脚本修改为我想要的样子。

这是脚本：

var i=0;
function addRow()
{
 i++;
  m.r.value = i;
  var tbl = document.getElementById('table');
  var lastRow = tbl.rows.length;
  var iteration = lastRow - 1;
  var row = tbl.insertRow(lastRow);
  var cellLeft = row.insertCell(0);
  var textNode = document.createTextNode(iteration);
  cellLeft.appendChild(textNode);
  var cellRightSel1 = row.insertCell(1);
  var sel = document.createElement('select');
  sel.name = 'name' + iteration;
  sel.setAttribute("onchange", "choosec(this);");    
  var item = new Option("","");
  sel.options[sel.length] = item;
    <?
    while($data = mysql_fetch_array($result)){                                    
    ?>
  var item = new Option("<?=$data["Name"];?>","<?=$data["ID"];?>");
  sel.options[sel.length] = item;
  <? } ?>
  cellRightSel1.appendChild(sel);
  var cellRightSel2 = row.insertCell(2);
  var sel = document.createElement('select');
  sel.name = 'class' + iteration;
  sel.setAttribute("onchange", "choosepoint(this);");    
  var item = new Option ("","");
  sel.options[sel.length] = item;
    <?
    while($data = mysql_fetch_array($result_sub)){                                    
    ?>
  var item = new Option("<?=$data["Class"];?>","<?=$data["ID"];?>");
  sel.options[sel.length] = item;
  <? } ?>
  cellRightSel2.appendChild(sel);
  var cellRight = row.insertCell(3);
  var div = document.createElement('div');
  div.id = 'point' + iteration;
  cellRight.appendChild(div);
}

function removeRow(){
  var tbl = document.getElementById('table');
  var lastRow = tbl.rows.length;
  var rem = lastRow - 1;
  if (lastRow > 2) tbl.deleteRow(rem);
}

感谢您的帮助。

我解决的问题：

function removeRow(t){
      var i = t.parentNode.parentNode.rowIndex;
      var tbl = document.getElementById('table');
      var lastRow = tbl.rows.length;
      var iteration = lastRow - 1;
      tbl.deleteRow(i);
    }

像这样尝试

<tr onclick="removeRow(this);">...</tr>

然后在javascript方法中

function removeRow(row){
  var tbl = row.parentNode;
  var index = row.parentNode.rowIndex;
  if (index > 2) tbl.deleteRow(index);
}

我找到了一个适合你要求的好例子。请在此处检查

这是需要更改的代码：

  var rem = lastRow - 1;

现在，这永远是最后一排。您可以围绕它构建一些逻辑来传递索引，或者查找字符串，或者其他什么，但tbl.deleteRow（）需要在特定索引处删除。

如果您想删除第三行，例如：

var rem = 2; //zero-based index
相关文章：