?

1 // 為了看效果，隨意寫的動畫 2 $('#animater').animate({ 3 'right':-800 4 }, 3000).animate({'font-size':'16px'},'normal').animate({'font-size':'26px'},'normal').animate({'font-size':'36px'},'normal').animate({'font-size':'46px'},'normal').animate({'font-size':'56px'},'normal').animate({'opacity':0},'normal').animate({'opacity':1},'normal').animate({'left':200,'font-size':'16px'},'normal'); 5 6 7 8 9 // 點擊不同的button執行不同的操作 10 11 $('#button1').click(function(){ 12 //默認參數是false，不管寫一個false還是兩個false還是沒寫false效果一樣 13 $('#animater').stop(); 14 }); 15 $('#button2').click(function(){ 16 //第二個參數默認false 17 $('#animater').stop(true); 18 }); 19 $('#button3').click(function(){ 20 $('#animater').stop(false,true); 21 }); 22 $('#button4').click(function(){ 23 $('#animater').stop(true,true); 24 });

?

?

?

?

W3School上是這樣的說明的：

stop(stopAll,goToEnd)

參數描述

stopAll	可選。規定是否停止被選元素的所有加入隊列的動畫。
goToEnd	可選。規定是否允許完成當前的動畫。 該參數只能在設置了 stopAll 參數時使用。

我的理解：

stopAll 為false時，不停止被選元素所有加入隊列的動畫,僅停止當前的動畫。stopAll為true時，停止所有加入隊列的動畫（如goToend為true，直接跳到當前動畫的最終效果）。

goToend為false時，不允許直接跳到當前動畫的最終效果(應該就是所謂的完成當前的動畫吧)，goToend為true時，允許直接跳到完成當前動畫的最終末尾效果

?

每次運行頁面,animater運動時，點擊不同button,看到如下不同的效果（animater處在動畫1時點擊）：

點擊按鈕button1（stop()），由于兩個參數都是false。所以點擊發生時，animater沒有跳到當前動畫（動畫1）的最終效果，而直接進入動畫2，然后動畫3，4，5.直至完成整個動畫。

點擊按鈕button1（stop(true)），由于第一個是true，第二個是false，所以animater立刻全部停止了，動畫不動了。

點擊按鈕button1（stop(false,true)），由于第一個是false，第 二個是true，所以點擊發生時，animater身處的當前動畫（動畫1）停止并且animater直接跳到當前動畫（動畫1）的最終末尾效果位置，接 著正常執行下面的動畫（動畫2，3，4，5），直至完成整個動畫。

點擊按鈕button1（stop(true，true)），由于兩個都是true，所以點擊發生時，animater跳到當前動畫（動畫1）的最終末尾效果位置，然后，全部動畫停止。

?

工作中遇到過的實際案例：

我在項目里做的一個下拉菜單，當鼠標移上去的時候就菜單顯示，當鼠標離開的時候菜單隱藏

如果我快速不斷地將鼠標移入移出菜單（即，當菜單下拉動畫未完成時，鼠標又移出了菜單）就會產生“動畫積累"，當鼠標停止移動后，積累的動畫還會持續執行，直到動畫序列執行完畢。 解決方法：在寫動畫效果的代碼前加入stop(true，true)，這樣每次快速的移入移出菜單，就正常了，當移入一個菜單的時候，停止所有加入隊列的動畫，但是完成當前的動畫（跳至當前動畫的最終效果位置） 轉載自http://www.cnblogs.com/wenzichiqingwa/archive/2012/11/21/2780996.html 完全是轉發，若有版權問題，請聯系我。

轉載于:https://www.cnblogs.com/Sinhtml/p/3747561.html

總結

以上是生活随笔為你收集整理的jquery之stop()的用法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。