在表格行上使用 .remove 会产生显示样式：无答案

【问题标题】：Using .remove on a table row produces style of display:none在表格行上使用 .remove 会产生显示样式：无
【发布时间】：2015-05-29 22:32:47
【问题描述】：

我正在尝试从我的表中删除一行。每行包含一个文本输入、编辑按钮和删除按钮。当我单击删除时，我希望删除整行。这是我的 jQuery 代码：

$(document).on('click', 'button#delete_x',  function () {
    $(this).closest('tr').fadeOut(500, function(){
        $(this).parents('tr:first').remove();
    });
});

我无权访问行 ID，因此我正在获取最接近删除按钮的 tr。我的问题不是删除该行，而是在我的 tr!我想知道为什么会这样？我在 mac yosemite 上使用 safari 浏览器。

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

fadeOut() 与删除一行不同。你想要 .remove()

【讨论】：

感谢您在我将其更改为 .remove() 后完美运行！

【解决方案2】：

您正在尝试删除作为动画行的父行而不是行本身的行。

这是因为实际的“this”值取决于调用站点，或者是否像大多数 jquery 方法一样，取决于显式强制执行的操作。

在 jquery 中，“this”通常被强制为你正在操作的元素。因此，当您将回调传递给 fadeOut() 方法时，在此回调中，“this”将指向淡出的元素（在本例中为您要删除的行）。

试试这个：

$(document).on('click', 'button#delete_x',  function () {
    $(this).closest('tr').fadeOut(500, function(){
        $(this).remove();
    });
});

...甚至更清楚：

$(document).on('click', 'button#delete_x',  function () {
    var me = $(this).closest('tr');
    me.fadeOut(500, function(){
        me.remove();
    });
});

【讨论】：

【解决方案3】：

这是因为您使用的是.fadeOut()。您想使用 jquery .remove() 简单地删除元素：

$(document).on('click', 'button#delete_x', function () {
    $(this).parents('tr:first').remove();
});

附言我还想看看你的 html 标记的副本。

【讨论】：