为什么当我点击div更快时，jQuery的animate（）函数不起作用？

在一个div中，我放置了一些div，并设置了溢出：隐藏。主div可以显示五个子div，之后我需要滚动查看其余的div。向下滚动我创建了一个div，并点击该div的功能，我正在滚动div的其余部分。代码如下：为什么当我点击div更快时，jQuery的animate（）函数不起作用？

if(whatsupobj.length > 5){ 
    $('#scrolldown').click(function(){ 
     var toppx = whatsupobj.length-1; 
     var lastdivtoppx = '268px';          
     if($('#subdiv'+toppx).css('top') !== lastdivtoppx){ 
      $(".subdiv").animate({"top": "-=67px"}, "medium"); 
     } 
    }); 

    $('#scrollup').click(function(){ 
     if($('#subdiv0').css('top') !== '0px'){ 
      $(".subdiv").animate({"top": "+=67px"}, "medium"); 
     } 
    }); 
}else{ 
    $('#scrollup').unbind("click"); 
    $('#scrolldown').unbind("click"); 
}

其工作正常只有一个问题。问题是，当我点击scrolldown非常快，然后子div继续下去。但是当我点击scrolldown通常然后停止时最后的div显示自己。我知道我可以增加或减少动画的速度，但它的速度并不快。我该如何解决这个问题？提前致谢。

来源

2011-12-14 Piscean

我只是找出这个链接。它解决了我的问题 http://stackoverflow.com/questions/5380722/disable-a-link-temporarily-when-clicked – Piscean 2011-12-14 12:50:43

据我可以告诉你的问题可能是这个.animate({"top": "+=67px"}的一段代码。

您应该添加.stop（），所以当你再次点击和一点儿也不只知道不断前进，像这样停止：$(".subdiv").stop().animate({"top": "+=67px"}, "medium");

现在，您的问题将是您的加减原始值，除非动画完成，否则你的值将全部搞乱。

最好的解决方案是在做这些类型的动画时不要加减，最好从元素本身获取你的css值，或者至少明确地设置css值，如下所示：animate({"top": "67px"}，但你会有构建一种为每个后续点击找到正确值的方法。

第二种选择是将stop（）设置为自动转到动画的结尾，如果处理程序被重复点击，这会让您的动画略过一点，但这是解决问题的最简单方法，看起来像这样：

$(".subdiv").stop(true, true).animate({"top": "+=67px"}, "medium");

来源

2011-12-14 12:13:20 adeneo

为什么当我点击div更快时，jQuery的animate（）函数不起作用？

回答

相关问题