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未在第二个回调中定义。更改其范围，以便两个回调都可以看到。

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()。

Answer 3

变量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');
    });
  });