Question

我正在编写一个简单的程序来点击按钮删除表格行。但代码总是删除需要删除的行上方的行。请帮忙。

以下是代码：

JAVASCRIPT：

function deleteRow(){

    var rows = document.getElementsByName("chkBox");
    alert('rows: '+rows.length);
    for(var row=0;row<rows.length;row++){

        //alert("element id is"+rows[row].id);
        var rowToDelete = rows[row];
        var toBeDelete = rowToDelete.checked;
        //alert("element value is: "+toBeDelete);
        if(toBeDelete == true){
        alert("row id is: "+rowToDelete.parentNode.parentNode.id);
        document.getElementById("myTable").deleteRow(rowToDelete.parentNode.parentNode);
        }
    }
}

HTML：

<table id="myTable" border="1">
<tr id="1">
  <td>Row 1</td>
  <td><input type="checkbox" name="chkBox" id="chkBox_1"/></td>
</tr>
<tr id="2">
  <td>Row 2</td>
  <td><input type="checkbox" name="chkBox" id="chkBox_2"/></td>
</tr>
<tr id="3">
  <td>Row 3</td>
  <td><input type="checkbox" name="chkBox" id="chkBox_3"/></td>
</tr>
</table>
<button value="Delete" name="Delete" onClick="deleteRow()">Delete</Button>

Fiddle

Answer 1

您需要将索引传递给deleteRow。 deleteRow - MDN

我认为这就是你应该做的事情：

   document.getElementById("myTable").deleteRow(row);

Javascript正在删除要删除的行上方的行

1 个答案: