jQuery中clearQueue()方法用法实例

  本文实例讲述了jQuery中clearQueue()方法用法。分享给大家供大家参考。具体分析如下:

  此方法能够清空对象上尚未执行的所有队列。

  如果不带参数,则默认清空的是动画队列。这跟stop(true)类似,但stop()只能清空动画队列,而这个可以清空所有通过queue()创建的队列。

  语法结构:

  

复制代码 代码如下:
$(selector).clearQueue(queueName)

  参数列表:

  

参数 描述
queueName 可选。定义要停止的队列的名称。
默认是 "fx",动画队列。

  实例代码:

  

复制代码 代码如下:

  <!DOCTYPE html>

  <html>

  <head>

  <meta charset=" utf-8">

  <meta name="author" content="http://www.glzy8.com/" />

  <title>管理资源吧</title>

  <style type="text/css">

  #father

  {

  background:#060;

  width:300px;

  height:300px;

  }

  #box

  {

  background:red;

  height:50px;

  width:50px;

  position:relative

  }

  </style>

  <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

  <script type="text/javascript">

  $(document).ready(function(){

  $("#start").click(function(){

  $("#box").animate({height:200},"slow");

  $("#box").animate({width:200},"slow");

  $("#box").animate({height:50},"slow");

  $("#box").animate({width:50},"slow");

  });

  $("#clear").click(function(){

  $("#box").clearQueue();

  });

  });

  </script>

  </head>

  <body>

  <p>

  <button id="start">开始执行动画</button>

  <button id="clear">清除队列</button>

  </p>

  <div id="father">

  <div id="box"></div>

  </div>

  </body>

  </html>

  希望本文所述对大家的jquery程序设计有所帮助。