用jQuery删除表格行的最佳方法是什么？
用jQuery去除表格行的最佳方法是什么？
你是对的：
$('#myTableRow').remove(); 这工作正常，如果你的行有一个id ，如：
<tr id="myTableRow"><td>blah</td></tr>
如果你没有一个id ，你可以使用任何jQuery的select器过多 。
@Eikern
如果你要使用jQuery，请使用jQuery man！
$('#myTable tr').click(function(){ $(this).remove(); return false; });
假设你在表格中的数据单元格内有一个button/链接，像这样的东西可以做到这一点…
$(".delete").live('click', function(event) { $(this).parent().parent().remove(); });
这将删除被点击的button/链接的父母。 你需要使用parent（），因为它是一个jQuery对象，而不是一个普通的DOM对象，并且你需要使用parent（）两次，因为button位于一个数据单元里面，你想删除什么。 $（this）是点击的button，所以只需要这样的东西只会删除button：
$(this).remove();
虽然这将删除数据单元格：
$(this).parent().remove();
如果你想简单地点击行的任何地方删除它就可以了。 你可以很容易地修改这个提示用户或者只在双击工作：
$(".delete").live('click', function(event) { $(this).parent().remove(); });
希望有所帮助…我自己有点挣扎。
您可以使用：
$($(this).closest("tr"))
用于查找元素的父表行。
它比parent（）。parent（）更优雅，这就是我开始做的事情，很快就学到了我的方法的错误。
– 编辑 – 有人指出，这个问题是关于删除行…
$($(this).closest("tr")).remove()
正如下面所指出的，你可以简单地做：
$(this).closest('tr').remove();
类似的代码片段可以用于许多操作，例如在多个元素上触发事件。
容易..试试这个
$("table td img.delete").click(function () { $(this).parent().parent().parent().fadeTo(400, 0, function () { $(this).remove(); }); return false; });
所有你需要做的就是从你的表中删除表格行（ <tr> ）标签。 例如，这里是从表中删除最后一行的代码：
$('#myTable tr:last').remove();
*上面的代码是从这个jQuery Howto发布 。
function removeRow(row) { $(row).remove(); } <tr onmousedown="removeRow(this)"><td>Foo</td></tr>
也许这样的事情可以工作？ 我还没有尝试过用“这个”做什么，所以我不知道它是否有效。
试试这个大小
$(this).parents('tr').first().remove();
完整列表：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('.deleteRowButton').click(DeleteRow); }); function DeleteRow() { $(this).parents('tr').first().remove(); } </script> </head> <body> <table> <tr><td>foo</td> <td><a class="deleteRowButton">delete row</a></td></tr> <tr><td>bar bar</td> <td><a class="deleteRowButton">delete row</a></td></tr> <tr><td>bazmati</td> <td><a class="deleteRowButton">delete row</a></td></tr> </table> </body> </html>
看到它在行动
以下是可以接受的：
$('#myTableRow').remove();
另一个由empty() ：
$(this).closest('tr').empty();
如果你想删除的行可能会改变，你可以使用这个。 只要通过这个函数你想删除的行。
function removeMyRow(docRowCount){ $('table tr').eq(docRowCount).remove(); }
$('tr').click(function() { $(this).remove(); });
我想你会尝试上面的代码，因为它的工作，但我不知道为什么它的工作一段时间，然后整个表被删除。 我也试图通过单击行删除行。 但找不到确切的答案。
如果你有这样的HTML
<tr> <td><span class="spanUser" userid="123"></span></td> <td><span class="spanUser" userid="123"></span></td> </tr>
其中userid="123"是一个自定义属性，可以在构build表时dynamic填充，
你可以使用类似的东西
$(".spanUser").live("click", function () { var span = $(this); var userid = $(this).attr('userid'); var currentURL = window.location.protocol + '//' + window.location.host; var url = currentURL + "/Account/DeleteUser/" + userid; $.post(url, function (data) { if (data) { var tdTAG = span.parent(); // GET PARENT OF SPAN TAG var trTAG = tdTAG.parent(); // GET PARENT OF TD TAG trTAG.remove(); // DELETE TR TAG == DELETE AN ENTIRE TABLE ROW } else { alert('Sorry, there is some error.'); } }); });
所以在这种情况下，您不知道TR标签的类别或ID，但无论如何您都可以将其删除。
我感谢这是一个旧的post，但我也希望这样做，发现接受的答案不适合我。 假设JQuery已经写完了，
无论如何，我发现以下为我工作：
$('#resultstbl tr[id=nameoftr]').remove();
不知道这是否有助于任何人。 我上面的例子是一个较大的函数的一部分，所以不包裹在一个事件监听器。
我在我的代码中使用了这个：
> $("#tbl").on("click", ".delete-row", function () { > $(this).closest('tr').remove(); > });
ID现在不是一个好的select器。 你可以在行上定义一些属性。 你可以使用它们作为select器。
<tr category="petshop" type="fish"><td>little fish</td></tr> <tr category="petshop" type="dog"><td>little dog</td></tr> <tr category="toys" type="lego"><td>lego starwars</td></tr>
你可以使用一个func来select这样的行（ES6）：
const rowRemover = (category,type)=>{ $('tr[category=${category}][type=${type}]').remove(); } rowRemover('petshot','fish');
