FadeOut и удалить строку таблицы - PullRequest
Новая
       60

FadeOut и удалить строку таблицы

8 голосов
/ 29 августа 2011

Я знаю, что этот вопрос задавался ранее, но у меня, похоже, другая проблема, чем была решена ранее.У меня есть таблица, и я хотел бы, чтобы в каждой строке была ссылка для удаления, которая затемняет строку таблицы, а затем удаляет строку таблицы из DOM.Моя первая проблема заключалась в том, что я не смог заставить эффект jQuery fadeOut работать со строками таблицы и обнаружил, что вам нужно вызвать fadeOut для элементов строки td.Итак, вот мой 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, который был скрыт.Из моего понимания «это» должно было ссылаться на исчезнувший элемент.

Есть идеи?

Ответы [ 2 ]

14 голосов
/ 29 августа 2011

Возьмите ссылку "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;
});
5 голосов
/ 29 августа 2011

Я думаю, это то, что вы ищете: 

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

РЕДАКТИРОВАТЬ: Я думаю, Опатут прав , как показано в его jsFiddle .

...