JQuery FADEOUT устанавливает непрозрачность 1

Я буду держать его коротким, рассмотрим следующую строку:JQuery FADEOUT устанавливает непрозрачность 1

$record.fadeOut(250);

Где $record представляет собой строку таблицы, которая выглядит следующим образом:

<tr id="5194c885eb9fbf38aa000026" class="record"> 
    <td>Test</td> 
    <td>2013/05/16 - 13:52</td> 
    <td>2013/05/16 - 13:52</td> 
    <td class="recordActions"> 
     <a title="Edit" href="/2configure/templates/devicetypes/5194c885eb9fbf38aa000026/edit" class="edit"> 
      <img src="/icons/document--pencil.png" alt="edit"> 
     </a> 
     <a title="Delete" href="/2configure/templates/devicetypes/5194c885eb9fbf38aa000026" class="delete"> 
      <img src="/icons/cross.png" alt="delete"> 
     </a> 
    </td> 
</tr>

Я абсолютно что $record содержит этот элемент и ничего больше.

Не применяется CSS. После .fadeOut(250), результат:

<tr id="5194c885eb9fbf38aa000026" class="record" style="opacity: 1"> 
    ... 
</tr>

Что дает?!?

JQuery версия 1.7.1

Edit: полная функция

function onEntityUpdateSuccess(record_html, statusText, jqXhr, jqForm) { 
    var $record = $(".record#" + jqForm.find('input[name="id"]').val()); 
    var $listingContainer = $record.parents(".listingContainer"); 
    if(!$listingContainer.is(":visible")) { 
     $listingContainer.slideDown(250); 
    } 

    $record.animate({opacity:0}, 250); 
    $record.replaceWith(record_html); 
    $record.animate({opacity:0}, 250); 
    //$record.fadeIn(1000); 
}

UPDATE

Aioros нашел вопрос:

$record.replaceWith(record_html);

является виновником. Но почему же вторая анимация не работает? Как я могу заменить HTML и сохранить его в тени?

источник

2013-05-16 MarioDS

Можете ли вы показать код, который выполняет .fadeOut (250)? скорее всего, существует логическая проблема, вызывающая срабатывание fadeIn. –

$ record = $ ('. Record'), вы используете селектор классов, не так ли? –

@KevinB У меня нет 'fadeIn' ** в любом месте ** в моем коде. Я, хотя это проблема, но я прокомментировал это. – MarioDS

Как я уже говорил в комментариях, .replaceWith() удаляет $record элемент из DOM, так что второй .animate() не имеет никакого видимого эффекта. Вам придется переназначить переменную или снова использовать селектор.

function onEntityUpdateSuccess(record_html, statusText, jqXhr, jqForm) { 
    var $record = $(".record#" + jqForm.find('input[name="id"]').val()); 
    var $listingContainer = $record.parents(".listingContainer"); 
    if(!$listingContainer.is(":visible")) { 
     $listingContainer.slideDown(250); 
    } 

    $record.animate({opacity:0}, 250); 
    $record.replaceWith(record_html); 

    $record = $(".record#" + jqForm.find('input[name="id"]').val()); 
    /* or whatever the selector needs to be */ 

    $record.animate({opacity:0}, 250); 
    //$record.fadeIn(1000); 
}

источник

2013-05-16 15:34:43 Aioros

Действительно, но я нахожу, что это странное поведение. Почему jQuery не делает это по умолчанию в возвращаемом значении? Спасибо, кстати, куча. – MarioDS

@MarioDeSchaepmeester - jQuery может обрабатывать узлы вне DOM в переменных объекта. Иногда вы хотите заменить элемент другим, а затем переместить оригинал в другое место. Если он автоматически переназначается на 'replaceWith()' return, вы потеряете этот исходный узел. Это более гибко, но, возможно, немного менее интуитивно. – Corion

Это не так уж странно. Вы в основном делаете что-то вроде «old.replaceWith (new)», чтобы вы не ожидали, что переменная old все еще будет ссылаться на элемент DOM на странице. – Aioros

Вы хотите, чтобы непрозрачность была установлена на 0? Я хотел бы поблагодарить, что fadeOut установил непрозрачность 0, но, увы, здесь есть несколько разных вариантов.

$record.animate({opacity:0}); 
$record.fadeTo('slow', 0);

источник

2013-05-16 15:14:16

Я попробую. – MarioDS

fadeOut() должен работать так же хорошо –

fadeOut() задает непрозрачность 0, если он работает, что в этом случае явно не работает, что опять означает, что, скорее всего, и не будет ответа выше, так как он точно тоже самое ? – adeneo

JQuery FADEOUT устанавливает непрозрачность 1

ответ

Смежные вопросы