删除包含单击的td JQuery的行

Sah*_*dah 2 html jquery html-table

我正在尝试管理HTML表,添加和删除行。我想做的是通过单击元素()删除整行。但是,当单击一个元素时,所有标签的父元素都将被删除。无论如何,都可以指定被单击的元素,并仅删除专门针对此类可调整表的可包含和删除行的包含该元素的行。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("td").click(function(){
    $("td").parentsUntil("table").remove();
    });
});
</script>
</head>

<body> 
  <table border="1">
    <tr><td>test1</td><td>test2</td><td>test3</td><td>test4</td></tr>
    <tr><td>test5</td><td>test6</td><td>test7</td><td>test8</td></tr>
  </table>
</body>

</html>
Run Code Online (Sandbox Code Playgroud)

Mil*_*war 5

您需要遍历单击处理程序中最接近的tr元素,然后将其删除。为此,您需要单击元素的jquery对象以及.closest().parent()选择器:

$("td").click(function(){
      $(this).closest("tr").remove();
});
Run Code Online (Sandbox Code Playgroud)

工作片段:

$("td").click(function(){
      $(this).closest("tr").remove();
});
Run Code Online (Sandbox Code Playgroud)