2012-03-01 61 views
0

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

下面是代码:

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

回答

2

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

我觉得这是你的线路应该是什么:

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