Question

我不确定如何标题这个。但我有一个mouseenter / mouseleave行为，分别上下滑动菜单。除非用户将鼠标快速移入和移出元素几次，否则它的效果很好。然后，所有动画都被触发，菜单“变为bezerk”并继续动画。

我想要的是取消绑定mouseenter事件，直到mouseleave事件完成。我尝试过几种不同的方法，包括stop（）和stopPropogation（），但它没有用。

我得到了这段代码，但对我来说似乎并不“正确”。

 function add_menu_listener(menu, affected){
    $j(menu).mouseenter(function(e){
        $j(menu).unbind('mouseenter');
       $j(menu + " > ul.links").slideDown();
       $j(affected).attr('src', "/images/down_arrow_menu.png");
    }).mouseleave(function(e){
        $j(menu + " > ul.links").slideUp( 500, function(){
           add_menu_listener(menu, affected);
        });
        $j(affected).attr('src', "/images/right_arrow_menu.png");
    });
  }

Answer 1

以下是动画中添加了.stop(true,true)的更新小提琴：http://jsfiddle.net/maniator/TBxgP/1/

代码：

  function add_menu_listener(menu, affected){
    $j(menu).mouseenter(function(e){
       $j(menu + " > ul.links").stop(true,true).slideDown();
       $j(affected).attr('src', "/images/down_arrow_menu.png");
    }).mouseleave(function(e){
        $j(menu + " > ul.links").stop(true,true).slideUp(500);
        $j(affected).attr('src', "/images/right_arrow_menu.png");
    });
  }

Answer 2

根据你的帖子，我想你已经看过这个，或类似的东西：

http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup

顺便提一下，如果您要同时使用hover()和mouseenter()，我建议您使用mouseleave()。

最终，如果您的解决方案有效，可读性和可执行性（我认为所有这些都适用于此处），那就没关系。

mouseenter / mouseleave动画链停止

2 个答案: