jQuery:Stop()关于Animate()的事件处理问题完成

时间:2012-05-22 08:49:49

标签: jquery event-handling jquery-animate

假设我有这两个功能:

$(".a").animate(
        {"left":"100%"},
        {duration:10000, complete:function(){
             //Something is triggered!! e.g 
             alert("a");
            //Please note: In actual case it is never as simple as alert("a").
        }}
);

$(".b").mouseover(function(){
    $(".a").stop().animate({"top":"100px"},{duration:5000});
});
  • 根据这些,.a只要.b就会停止 mouseover - ed和animate({"top":"100px"},{duration:5000})会 被触发。

  • 但是当alert("a").b时,我希望mouseover 一次 然后触发animate({"top":"100px"},{duration:5000})

但是,我无法以这种方式设置第二个功能:

$(".b").mouseover(function(){
        //something happens! e.g
        alert("a");
        $(".a").stop().animate({"top":"100px"},{duration:5000});
    });
  • 如果alert("a").b mouseover,那么.a 两次 animate

我已经尝试stop()的{​​{1}}并且它不理想

每当jumpToEnd parameter.b时,mouseover的{​​{1}}即时完成,.a将转移到animte。我希望它.a位于left:100%,而stop在第二次alert("a")被触发之前


如果有人可以为此提供快速简便的解决方案,我将非常感激!

2 个答案:

答案 0 :(得分:1)

您可以通过对:animated进行过滤来检查元素当前是否为动画

$('.b').mouseover(function () {

    // if NOT animating, then terminate
    if (!$('.a').is(':animated')) { return; }

    // carry on

});

答案 1 :(得分:1)

$(".a").animate(
        {"left":"100%"},
        {duration:10000, complete:myAfterWork} // Use the function name only
);

$(".b").mouseover(function(){
    myAfterWork();
    $(".a").stop().animate({"top":"100px"},{duration:5000});
});

function myAfterWork()
{
  if($(".a").is(":animated"))
  {
    //Access $(".a") here and do your job

    //Note if you use $(this) in place of $(".a") it will be different 
    //when called from .a's animation than from .b's animation
  }

}