jQuery中clearQueue()方法用法实例


Posted in Javascript onDecember 29, 2014

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

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

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

语法结构:

$(selector).clearQueue(queueName)

参数列表:

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

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.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程序设计有所帮助。

Javascript 相关文章推荐
js弹出框轻量级插件jquery.boxy使用介绍
Jan 15 Javascript
javascript学习笔记(六)数据类型和JSON格式
Oct 08 Javascript
详解js中class的多种函数封装方法
Jan 03 Javascript
Bootstrap安装环境配置教程分享
May 27 Javascript
多种jQuery绑定事件的实现方式
Jun 13 Javascript
一次$.getJSON不执行的简单记录
Jul 19 Javascript
微信小程序ajax实现请求服务器数据及模版遍历数据功能示例
Dec 15 Javascript
详解如何用模块化的方式写vuejs
Dec 16 Javascript
JS解析后台返回的JSON格式数据实例
Aug 06 Javascript
Vue退出登录时清空缓存的实现
Nov 12 Javascript
JavaScript canvas动画实现时钟效果
Feb 10 Javascript
微信小程序APP的生命周期及页面的生命周期
Apr 19 Javascript
JavaScript实现穷举排列(permutation)算法谜题解答
Dec 29 #Javascript
浅谈JavaScript Array对象
Dec 29 #Javascript
JavaScript实现N皇后问题算法谜题解答
Dec 29 #Javascript
jQuery中dequeue()方法用法实例
Dec 29 #Javascript
jQuery中queue()方法用法实例
Dec 29 #Javascript
浅谈JavaScript function函数种类
Dec 29 #Javascript
JavaScript异步加载浅析
Dec 28 #Javascript
You might like
php格式化json函数示例代码
2016/05/12 PHP
laravel框架中间件 except 和 only 的用法示例
2019/07/12 PHP
基于thinkphp5框架实现微信小程序支付 退款 订单查询 退款查询操作
2020/08/17 PHP
jQuery学习5 jQuery事件模型
2010/02/07 Javascript
基于jquery完美拖拽,可返回拖动轨迹
2012/03/29 Javascript
Extjs4实现两个GridPanel之间数据拖拽功能具体方法
2013/11/21 Javascript
JavaScript File API实现文件上传预览
2016/02/02 Javascript
ion content 滚动到底部会遮住一部分视图的快速解决方法
2016/09/06 Javascript
webpack之devtool详解
2018/02/10 Javascript
详解webpack loader和plugin编写
2018/10/12 Javascript
vue发送websocket请求和http post请求的实例代码
2019/07/11 Javascript
基于js判断浏览器是否支持webGL
2020/04/18 Javascript
python赋值操作方法分享
2013/03/23 Python
Python实现的朴素贝叶斯算法经典示例【测试可用】
2018/06/13 Python
Django框架的使用教程路由请求响应的方法
2018/07/03 Python
详解Python 多线程 Timer定时器/延迟执行、Event事件
2019/06/27 Python
ipad上运行python的方法步骤
2019/10/12 Python
在OpenCV里实现条码区域识别的方法示例
2019/12/04 Python
pytorch之添加BN的实现
2020/01/06 Python
Xadmin+rules实现多选行权限方式(级联效果)
2020/04/07 Python
Python pip install如何修改默认下载路径
2020/04/29 Python
彼得罗夫美国官网:Peter Thomas Roth美国(青瓜面膜)
2017/11/05 全球购物
Nike荷兰官方网站:Nike.com (NL)
2018/04/19 全球购物
项目副经理岗位职责
2013/12/30 职场文书
大学军训感言
2014/01/10 职场文书
挂牌仪式主持词
2014/03/20 职场文书
我的中国梦演讲稿800字
2014/08/19 职场文书
晋江市委常委班子四风问题整改工作方案
2014/10/26 职场文书
专业技术人员年度考核评语
2014/12/31 职场文书
大连导游词
2015/02/12 职场文书
培训简讯范文
2015/07/20 职场文书
公司人力资源管理制度
2015/08/05 职场文书
八年级作文之我的母亲
2019/12/10 职场文书
Java线程的6种状态与生命周期
2022/05/11 Java/Android
vue使用element-ui按需引入
2022/05/20 Vue.js
一文搞懂Java中的注解和反射
2022/06/21 Java/Android