从表中删除一行答案

【问题标题】：deleting a row from a table从表中删除一行
【发布时间】：2019-08-02 23:38:48
【问题描述】：

我正在尝试使用 javascript 从 html 表中删除一行。我知道它们是一个删除行的函数 DOM 函数，但我的表格在一个表单中，所以当我删除该行时，它会删除表单，所以我的按钮不起作用。有什么想法可以解决这个问题吗？

<table style="width:100%" id = "table" >
  <tr>
    <th>Ticket number</th>
    <th>Class</th>
    <th>Meal</th>
    <th>Seat Number</th>
    <th>Price</th>

  </tr>
  <%while(r.next()){ %>
  <tr>
    <td align="center"><form method="post" action="/AirportServer/html/Purchased.jsp">
    <input type="radio" name="Flight-Num" value = "<%=r.getString("ticket_unique_num") %>">
    <%=r.getString("ticket_unique_num") %> </td>
    <td align="center"><%=r.getString("class")%></td>
    <td align="center"><%=r.getString("meal") %></td>
     <td align="center"><%=r.getString("seat_number") %></td>
      <td align="center"><%=r.getString("fare") %></td>
     </tr>
    <%} %>
    <button type="submit">Reserve Ticket</button> 
</form>
</table>
<button onclick="filter()">Sort By low to High</button>

function filter(){

    var x = document.getElementById("table");
    x.deleteRow(1);

}

【问题讨论】：

Add/delete row from a table的可能重复
默认按钮是提交类型，所以你必须添加类型<button type="button" onclick="filter()">Sort By low to High</button>

标签： javascript html dom

【解决方案1】：

您应该尝试将 id 从 table 更改为唯一的东西。具体更改以下几行： <table style="width:100%" id = "table" > 并更新这个以反映之前的 sn-p getElementById("table")

您应该尝试的另一件事是关闭form 标签在 table 标签

【讨论】：

【解决方案2】：

您可以将<form> 放在<table> 之外，并在您的输入中使用form="" 属性来引用它。

<form name="myForm" action="/foo" method="POST"></form>

<table>
    <tr>
        <input type="text" form="myForm">
    </tr>
</table>

<button type="submit" form="myForm">Submit</button>

【讨论】：