防止jQuery效果重复执行

最新推荐文章于 2021-06-25 14:54:05 发布

PALE_BLUE_DOT

最新推荐文章于 2021-06-25 14:54:05 发布

阅读量1.7k

点赞数

本文链接：https://blog.csdn.net/u010304464/article/details/8881244

版权

jQuery的效果在添加了speed值时如果多次触发会一直重复执行这个效果。

解决办法：在执行的效果前加stop()事件。

例：

$(document).ready(function(){
           $("li").mouseover(function(){
               $(this).animate({marginTop:"20px"},100);
           });
           $("li").mouseout(function(){
               $(this).animate({marginTop:"15px"},100);
           });

})

在鼠标划过li标签时会重复执行修改如下

$(document).ready(function(){
           $("li").mouseover(function(){
               $(this).stop().animate({marginTop:"20px"},100);
           });
           $("li").mouseout(function(){
               $(this).stop().animate({marginTop:"15px"},100);
           });

})