Question

我的代码需要一些帮助。我想在点击该行的删除按钮时删除一行，并且不知道该怎么做。

<tbody id="myTable">
        <?php
            if (!isset($_SESSION)){
               session_start();
            }
            $conn=mysqli_connect("localhost","root","","dbname");

            $instS="Select cod_Produto,Nome_Produto,Marca,preço,Tipo_Produto_Id_tipo_produto from produto";
            $query = mysqli_query($conn,$instS);
            while ($row = mysqli_fetch_row ($query)){
              echo "<tr>";
              echo "<td>".$row[0]."</td> ";
              echo "<td>".$row[1]."</td>";
              echo "<td>".$row[2]."</td>";
              echo "<td>".$row[3]."</td>";
              echo "<td>".$row[4]."</td>";
              echo "<td> <center><a href='#'><button class='glyphicon glyphicon-remove' style='color:#D00000' </button></a></center></td>";
              echo "<td><center> <a href='#'><span class='glyphicon glyphicon-pencil'  style='color:#707070' >  </span></a></center></td>";
              echo "</tr>";
            }

        ?>
 </tbody>
</table>

Answer 1

<script>
    function SomeDeleteRowFunction(o) {
     //no clue what to put here?
     var p=o.parentNode.parentNode;
         p.parentNode.removeChild(p);
    }
    </script>

    <table>
       <tr>
           <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction(this)"></td>
       </tr>
       <tr>
           <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction(this)"></td>
       </tr>
       <tr>
           <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction(this)"></td>
       </tr>
    </table>

function SomeDeleteRowFunction(o) {
     //no clue what to put here?
     var p=o.parentNode.parentNode;
         p.parentNode.removeChild(p);
    }

<table>
       <tr>
           <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction(this)"></td>
       </tr>
       <tr>
           <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction(this)"></td>
       </tr>
       <tr>
           <td><input type="button" value="Delete Row" onclick="SomeDeleteRowFunction(this)"></td>
       </tr>
    </table>

Answer 2

这应该适用于这样的jQuery：

$( "tr" ).click(function() {
  $( this ).remove();
});

如何在项目中包含jQuery：

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>

Answer 3

您可以使用jQuery Traversing方法从html中删除父元素。

jQuery Traversing Methods和 jQuery Traversing

＆＃13;

$(".delete-button").on("click", function(){
  $(this).parent().prevAll().parent().remove();
});

＆＃13;

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Age</th>
    <th>Delete</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
    <td><button class='glyphicon glyphicon-remove delete-button' style='color:#D00000'></button></td>             
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
    <td><button class='glyphicon glyphicon-remove delete-button' style='color:#D00000'></button></td>  
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
   <td><button class='glyphicon glyphicon-remove delete-button' style='color:#D00000'></button></td>  
  </tr>
</table>
</body>
</html>

＆＃13;

从表中删除特定行

3 个答案: