仅使用javascript删除多个选定的表行

Deleting multiple selected table rows using only javascript

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

我想使用javascript删除表中选定的行，但问题是一旦删除一行，索引就会更改。

这个问题很混乱，因为只有特定的行包含复选框，并且可以添加更多的复选框。

我已经可以使用javascript在数组内部获得我想要删除的所有正确的行索引，但接下来我如何在不命中错误行且不使用prototype或jquery的情况下删除行呢。纯粹的javascript？

非常感谢您的帮助。

 <table class="example_table" id="mytable">
    <tbody>
          <tr>
                <td><input type="text" id="top row" /></td>
          </tr>
          <tr>
                <td><input type="button" onclick="addNewCheckboxRow()" /></td> 
          </tr>
          <tr>
                <td><input type="button" /></td> 
          </tr>
          <tr>
                <td><input type="checkbox" value="1" id="check1" /></td>  //row that may be deleted
          </tr>
          <tr>
                <td><input type="checkbox" value="2" id="check2" /></td>  //row that may be deleted
          </tr>
          <tr>
                <td><input type="checkbox" value="3" id="check3" /></td>  //row that may be deleted
          </tr>
          <tr>
                <td><input type="checkbox" value="4" id="check4" /></td>  //row that may be deleted
          </tr>   
          <tr>
                <td><input type="button" /></td> 7
          </tr>
        </tbody>
    </table>

我目前的做法。虽然不准确，但你可以得到漂移。

var myrow=["6","7"];
document.getElementById("mytable").deleteRow(myrow[0]); //deletes row 6
document.getElementById("mytable").deleteRow(myrow[1]); //deletes row 7 But
                                                        //the index has changed!
//what happens when after the delete more rows are added!

对数组从大元素到低元素进行排序。

function compareNumbers(a, b)
{
  return b - a;
}

然后从最大值移到最小值。

相关文章：