jquery 延迟执行实例介绍


Posted in Javascript onAugust 20, 2013
$(function(){ 
var $inputs = $('input[type=button]') 
.delay(500) 
.queue(function(){$(this).hide().dequeue();}) 
.delay(1500) 
.queue(function(){$(this).show();}); 
});

以上代码让页面中的按钮在页面加载后500毫秒隐藏,然后再过1500毫秒显示出来。
$(function(){ 
var $inputs = $('input[type=button]') 
.delay(500) 
.queue(function(){$(this).hide().dequeue();}) 
.delay(1500) 
.show(1); 
//.queue(function(){$(this).show();}); 
});

以上代码效果与前面的代码相同。
$(function(){ 
var $inputs = $('input[type=button]') 
.delay(500) 
.queue(function(){$(this).hide();}) 
.delay(1500) 
.show(1); 
//.queue(function(){$(this).show();}); 
});

以上代码同样只隐藏,不会再显示,相比代码2,queue里的代码没有调dequeue,由此可知,queue执行完后,也中止了动画队列的继续执行,需要调用dequeue使其执行下去(这里queue里的hide()不是一个动画,而将当前对象的动画放在queue里执行也会有问题)。
$(function(){ 
var $inputs = $('input[type=button]') 
.delay(500) 
.queue(function(){$(this).hide().dequeue();}) 
.delay(1500) 
.show(); 
//.show(1); 
});

以上代码只隐藏,而不会再显示!!这里show不再指定显示动画时长,则show方法不再是一个动画。由此可知,dequeue只能使得动画队列中的后续方法执行下去,不能使非动画队列中的jquery方法继续执行!
Javascript 相关文章推荐
javascript 静态对象和构造函数的使用和公私问题
Mar 02 Javascript
javascript XMLHttpRequest对象全面剖析
Apr 24 Javascript
移动手机APP手指滑动切换图片特效附源码下载
Nov 30 Javascript
jQuery实现带水平滑杆的焦点图动画插件
Mar 08 Javascript
Javascript中的几种继承方式对比分析
Mar 22 Javascript
jQuery增加和删除表格项目及实现表格项目排序的方法
May 30 Javascript
js输入框使用正则表达式校验输入内容的实例
Feb 12 Javascript
validationEngine 表单验证插件使用实例代码
Jun 15 Javascript
原生JavaScript实现Ajax异步请求
Nov 19 Javascript
vue 实现边输入边搜索功能的实例讲解
Sep 16 Javascript
使用jquery-easyui的布局layout写后台管理页面的代码详解
Jun 19 jQuery
vue路由跳转传递参数的方式总结
May 10 Javascript
多种方式实现JS调用后台方法进行数据交互
Aug 20 #Javascript
js获取指定日期前后的日期代码
Aug 20 #Javascript
js 自定义个性下拉选择框示例
Aug 20 #Javascript
JavaScript打印iframe内容示例代码
Aug 20 #Javascript
JQuery之focus函数使用介绍
Aug 20 #Javascript
html页面显示年月日时分秒和星期几的两种方式
Aug 20 #Javascript
网页中可关闭的漂浮窗口实现可自行调节
Aug 20 #Javascript
You might like
星际争霸 Starcraft 编年史
2020/03/14 星际争霸
PHP中防止SQL注入实现代码
2011/02/19 PHP
PHP把小数转成整数3种方法
2014/06/30 PHP
浅谈Coreseek、Sphinx-for-chinaese、Sphinx+Scws的区别
2016/12/15 PHP
php实现数组纵向转横向并过滤重复值的方法分析
2017/05/29 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
Ruffy javascript 学习笔记
2009/11/30 Javascript
jQuery制作仿腾讯web qq用户体验桌面
2013/08/20 Javascript
多种方法实现360浏览器下禁止自动填写用户名密码
2014/06/16 Javascript
5个书写JavaScript代码的坏习惯,看看你中枪了没?
2014/11/06 Javascript
浅谈使用MVC模式进行JavaScript程序开发
2015/11/10 Javascript
jquery验证手机号是否正确实例讲解
2015/11/17 Javascript
如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)
2016/02/23 Javascript
修改jquery中dialog的title属性方法(推荐)
2016/08/26 Javascript
JS中检测数据类型的几种方式及优缺点小结
2016/12/12 Javascript
详解vue axios用post提交的数据格式
2018/08/07 Javascript
详解如何在Node.js的httpServer中接收前端发送的arraybuffer数据
2018/11/11 Javascript
使用layui 的layedit定义自己的toolbar方法
2019/09/18 Javascript
Js利用正则表达式去除字符串的中括号
2020/11/23 Javascript
python实现的登陆Discuz!论坛通用代码分享
2014/07/11 Python
Python3.0与2.X版本的区别实例分析
2014/08/25 Python
利用Python如何批量修改数据库执行Sql文件
2018/07/29 Python
python pickle存储、读取大数据量列表、字典数据的方法
2019/07/07 Python
Python从列表推导到zip()函数的5种技巧总结
2019/10/23 Python
Django配置Bootstrap, js实现过程详解
2020/10/13 Python
Python存储读取HDF5文件代码解析
2020/11/25 Python
CSS实现鼠标滑过鼠标点击代码写法
2016/12/26 HTML / CSS
HTML5之SVG 2D入门3—文本与图像及渲染文本介绍
2013/01/30 HTML / CSS
法国票务网站:Ticketmaster法国
2018/07/09 全球购物
abstract 可以和 virtual 一起使用吗?可以和 override 一起使用吗?
2012/10/15 面试题
什么是Linux虚拟文件系统VFS
2015/08/25 面试题
预备党员转正思想汇报
2014/01/12 职场文书
青年文明号事迹材料
2014/01/18 职场文书
如何写通讯稿
2015/07/22 职场文书
消防安全主题班会
2015/08/12 职场文书
2016年万圣节活动个人总结
2016/04/05 职场文书