jQuery中dequeue()方法用法实例

2019/6/29 22:31:59

编程Tag： 方法 jQuery dequeue

本文主要是介绍jQuery中dequeue()方法用法实例，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

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

此函数能够从队列最前端移除一个队列函数，并执行它。
建议和queue()函数一起学习。

语法结构:

复制代码代码如下:

$(selector).dequeue(queueName)

参数列表:

参数	描述
queueName	可选。队列的名称。默认是 "fx"，动画队列。

实例代码:

复制代码代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="//www.zyiz.net/" />

<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程序设计有所帮助。

这篇关于jQuery中dequeue()方法用法实例的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

jQuery中dequeue()方法用法实例

相关编程文章