【JQuery】stop()函数

来源：互联网发布：three.js包下载编辑：程序博客网时间：2024/06/04 17:53

作用是停止动画效果，但是这里面的学问非常大。

格式是：

stop([stopAll], [gotoEnd])

两个参数都是布尔值，要么true要么false，且第二个参数是在设置了第一个参数之后才起作用的。

接下来就是重头戏了。

以下是我根据实验得出的，和很多文档上写的有出入，但是实验结论是这样的，希望有人反驳我。

1、无论第一个参数是false还是true，如果第二个参数是false，那么动画就停在当前状态。

2、无论第一个参数是false还是true，如果第二个参数是true，那么动画会首先直接跳到当前动画的末尾，然后再继续执行后面的动画。

3、如果只有一个参数或者没有参数，那么动画就停在当前状态。

例子。

    <body>        <h3>调用stop()方法停止当前所有动画效果</h3>         <span></span>        <input id="btnStop" type="button" value="停止" />        <div id="tip"></div>                <script type="text/javascript">              $(function () {                  $("span").animate({                      left: "+=100px"                   }, 3000, function () {                      $(this).animate({                        height: '+=60px',                         width: '+=60px'                    }, 3000, function () {                        $(this).animate({left:'+=100px'},3000,function(){$("#tip").html("执行完成!");})                      });                  });                                $("#btnStop").bind("click", function () {                   $("span").stop(false,true);                                    $("#tip").html("执行停止!");                });            });        </script>    </body>

0 0