淡出和删除表格行答案

【问题标题】：FadeOut and Remove Table Row淡出和删除表格行
【发布时间】：2011-11-06 06:10:43
【问题描述】：

我知道以前有人问过这个问题，但我似乎遇到了与以前解决过的问题不同的问题。我有一个表，我希望每一行都有一个删除链接，该链接使表行淡出，然后从 DOM 中删除表行。我的第一个问题是我无法让 jQuery fadeOut 效果在表格行上工作，并且发现您必须在行的 td 元素上实际调用 fadeOut。所以，这是我的 jJavascript：

$('span.deleteItem').live('click', function() {  
    $(this).closest('tr').find('td').fadeOut('fast', 
        function(){ 
            $(this).parents('tr:first').remove();                    
        });    

    return false;
});

span 元素位于 td 内，因此我在单击它时找到最近的 tr 元素，然后将fadeOut 函数放在它的每个 td 元素上。这很好用。

问题在于，在回调函数中，“this”实际上是在引用窗口元素，而不是隐藏的单个 td 元素。据我了解，“this”应该是指淡出的元素。

有什么想法吗？

【问题讨论】：

jsfiddle.net/TBMnZ 适合我...

标签： jquery html html-table hide fadeout

【解决方案1】：

获取“this”引用并将其传递：

$('span.deleteItem').live('click', function() {  
    var here = this;
    $(this).closest('tr').find('td').fadeOut('fast', 
        function(here){ 
            $(here).parents('tr:first').remove();                    
        });    

    return false;
});

【讨论】：

【解决方案2】：

我想这就是你要找的：

$('span.deleteItem').live('click', function() { 
    var tableRow = $(this).closest('tr');
    tableRow.find('td').fadeOut('fast', 
        function(){ 
            tableRow.remove();                    
        }
    );
});

编辑：我认为Opatut is right，如他的jsFiddle 所示。

【讨论】：