在表行上使用.remove会产生显示样式:none

Using .remove on a table row produces style of display:none

本文关键字：显示 样式 none remove      更新时间：2023-09-26

我正试图从我的表中删除一行。每行包含一个文本输入、编辑按钮和删除按钮。当我单击"删除"时，我希望删除整行。这是我的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浏览器

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

您要删除的行是行动画的父行，而不是行本身。

这是因为实际的"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();
    });
});

这是因为您正在使用. fadeout()。使用jquery .remove():

简单地删除元素
$(document).on('click', 'button#delete_x', function () {
    $(this).parents('tr:first').remove();
});

注。我还想看到你的html标记的副本。

相关文章：