JQuery, $ (это) не правильно в функции обратного вызова fadeIn, fadeOut? - PullRequest
Новая
       10

JQuery, $ (это) не правильно в функции обратного вызова fadeIn, fadeOut?

2 голосов
/ 02 февраля 2009

Я хотел бы fadeOut () изображение на странице и удалить его из DOM после завершения анимации. Звучит достаточно просто?

Пример кода (изображение имеет идентификатор "img1"): 

   $("#img1").fadeOut("slow", function() { $(this).remove() });

Это не работает. Когда я проверяю страницу с помощью Firebug, изображение все еще там. Это просто скрыто.

Второй пример, который должен отчасти мигать изображение: 

   $("#img1").fadeOut("slow", function() { $(this).fadeIn() });

Странно.

Спасибо за примеры страниц, которые отлично работают и, как и ожидалось.

Проблема должна быть в чем-то другом и возникает только в моей проектной среде.

Примечание: когда я выполняю простой файл console.log ($ (this)) в моей функции обратного вызова, результатом является сам объект window?

Когда я выясню, какие побочные эффекты создают проблему, я обновлю этот вопрос.

Ответы [ 4 ]

4 голосов
/ 02 февраля 2009

Оба примера работают для меня, как и ожидалось, как показано здесь (извиняюсь за плохое изображение, это было первое, что я нашел!). Изображение 1 исчезает, а затем удаляется из DOM, изображение 2 исчезает, а затем возвращается обратно в положение, в котором изначально находилось изображение 1.

Правильно ли я вас понял?

P.S. Вы можете отредактировать пример здесь

3 голосов
/ 04 апреля 2009

Запрос поддерживает связывание, что означает вы можете получить то же самое с следующие команды:

..

$ ( '# Img1') Затухание ( 'медленно') удалить (); $ ( '# Img1') Затухание ( 'медленно') FadeIn ( 'медленно');..

выглядит лучше, и будет работать =) 

$('#img1').fadeOut('slow').fadeIn('slow');

будет работать, потому что jQuery ставит эффекты в очередь, но когда вы вызываете 

$('#img1').fadeOut('slow').remove();

фреймворк будет запускать fadeOut в фоновом режиме и действовать как remove () до того, как объект начнет постепенно исчезать

1 голос
/ 02 февраля 2009

Это работает для меня. Инспектор HTML в Firebug 1.2.1 четко показывает удаляемый элемент. Возможно, вы не используете последнюю версию JQuery?

Мой тестовый код выглядит следующим образом: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script>
  $(document).ready(function(){

    $("p").click(function () {
      $("p").fadeOut("slow", function()
      {
         $(this).remove();
      });
    });

  });
  </script>
  <style>
  p { font-size:150%; cursor:pointer; }
  </style>
</head>
<body>
  <p>
    If you click on this paragraph
    you'll see it just fade away.
  </p>
</body>
</html>
0 голосов
/ 02 февраля 2009

jQuery поддерживает цепочку, что означает, что вы можете получить то же самое с помощью следующих команд: 

$('#img1').fadeOut('slow').remove();
$('#img1').fadeOut('slow').fadeIn('slow');

выглядит лучше, и будет работать =)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...