jQuery toggle () проблема

Question

  $('.toggle').toggle(function(){
    var ul = $('ul');
    ul.fadeOut('fast', function(){
      ul.fadeIn('fast').removeClass('off');
      ul.addClass('on');
    });
  }, function(){
    ul.fadeOut('fast', function(){
      alert('wtf'); // <- never gets here...
      ul.fadeIn('fast').removeClass('on');
      ul.addClass('off');
    });
  });

Что я делаю неправильно ??

Любой код, который я добавляю во вторую функцию обратного вызова fadeOut, никогда не выполняется ...

Answer 1

Поместите var ul = $('ul'); в вашу вторую функцию.

Answer 2

Переменная ul не существует в области действия второй функции. Это на самом деле немного ненужной оптимизации в вашем случае, так как следующее также должно работать:

  $('.toggle').toggle(function(){
    $('ul').fadeOut('fast', function(){
      $(this).fadeIn('fast').removeClass('off').addClass('on');
    });
  }, function(){
    $('ul').fadeOut('fast', function(){
      $(this).fadeIn('fast').removeClass('on').addClass('off');
    });
  });

Answer 3

ul не определено во втором обратном вызове. Измените его область видимости, чтобы он был виден обоим обратным вызовам.

var ul = $('ul');

$('.toggle').toggle(function(){
  ul.fadeOut('fast', function(){
    ul.fadeIn('fast').removeClass('off');
    ul.addClass('on');
  });
}, function(){
  ul.fadeOut('fast', function(){
    ul.fadeIn('fast').removeClass('on');
    ul.addClass('off');
  });
});

Если вы не хотите, чтобы ul находился за пределами этого, либо оберните его в функцию, вызывающую себя, либо укажите ul в каждом обратном вызове toggle().