本文實例講述了jQuery中dequeue()方法用法。分享給大家供大家參考。具體分析如下:
此函數能夠從隊列最前端移除一個隊列函數,并執行它。
建議和queue()函數一起學習。
語法結構:
$(selector).dequeue(queueName)
參數列表:            | 參數 |       描述 |     
          | queueName |       可選。隊列的名稱。       默認是 "fx",動畫隊列。 |     
  
實例代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.survivalescaperooms.com/" />
<title>dequeue()函數-武林網</title> 
<style type="text/css">
div 
{ 
  margin:3px; 
  width:50px; 
  position:absolute;
  height:50px; 
  left:10px; 
  top:30px; 
  background-color:yellow; 
}
div.red 
{ 
  background-color:red; 
} 
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function (){
    $("div").animate({left:'+=200px'}, 2000);
    $("div").animate({top:'0px'}, 600);
    $("div").queue(function(){
      $(this).toggleClass("red");
      $(this).dequeue();
    });
    $("div").animate({left:'10px', top:'30px'}, 700);
  });
})
</script>
</head>
<body>
  <button>開始</button>
  <div></div>
</body>
</html>
注意:運行編輯器之后,再按F5刷新網頁即可查看演示。
在以上代碼中,dequeue()函數可以在執行完$(this).toggleClass("red")之后,將會從隊列最前端移除$("div").animate({left:'10px', top:'30px'}, 700),也就是執行此animate動畫。
希望本文所述對大家的jQuery程序設計有所幫助。