如何解决这个jQuery问题

Question

我彼此之间有2个div，在给定的时刻显示一个，另一个隐藏，当鼠标进入＃div1时脚本应显示＃div2，而当鼠标离开＃div2时脚本应显示＃div1

问题是当鼠标进入＃div1并在显示＃div2之前离开时出现的，因此＃div2将保持显示状态，但是鼠标已经离开＃div2已经有任何帮助了？

我的jQuery代码：

$('#div1').mouseenter(function(){
 $('#div1').fadeOut("fast",function(){
  $('#div2').fadeIn("fast");
 });
});

$('#div2').mouseleave(function(){
 $('#div2').fadeOut("fast",function(){
  $('#div1').fadeIn("fast");
 });
});

Answer 1

我建议在这里使用hover() ：

$("#div1, #div2").hover(function() {
  $(this).stop().fadeOut("fast");
}, function() {
  $(this).stop().fadeIn("fast");
});

注意：我在动画上使用了stop() ，这是一个很好的习惯。 上面的版本还允许两个div具有相同的处理程序，从而减少了代码。