使用jquery的delay方式模拟sleep
javascript中并没有原生sleep函数可供调用,一般来说为了实现sleep功能,大都是采用SetTimeout来模拟,以下片段采用jquery的delay方法来模拟,也算是提供了另外一个视角吧
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>delay demo</title>
<style>
div {
position: absolute;
width: 60px;
height: 60px;
float: left;
}
.first {
background-color: #3f3;
left: 0;
}
.second {
background-color: #33f;
left: 80px;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<p><button>Run</button></p>
<div class="first"></div>
<div class="second"></div>
<script>
function fun1(){
alert("fun1");
}
function fun2(){
alert("fun2");
}
$( "button" ).click(function() {
$(":root").delay(3000).queue(function(){
fun1();
$(this).dequeue()
});
$(":root").delay(5000).queue(function(){
fun2();
$(this).dequeue()
});
// $(":root").delay(3000, 'q').queue('q', function(){
// fun1();
// $("div.second").delay(5000, 'q').queue('q',function(){
// fun2();
// }).dequeue('q');
// }).dequeue('q'); });
$(document).ready(function(){
// alert("OK");
$(":root").delay(3000).queue(function(){
fun1();
$(this).dequeue();
});
$(":root").delay(3000).queue(function(){
fun2();
$(this).dequeue();
});
// alert("end");
});
</script>
</body>
</html
参考资料:
http://api.jquery.com/queue/#queue-queueName-callback-next-
http://api.jquery.com/jQuery.queue/
http://blog.project-sierra.de/archives/1559
使用jquery的delay方式模拟sleep的更多相关文章
- jQuery效果之封装模拟placeholder效果,让低版本浏览器也支持
页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" pla ...
- HttpClient方式模拟http请求
方式一:HttpClient import org.apache.commons.lang.exception.ExceptionUtils; import org.apache.http.*; im ...
- HttpClient方式模拟http请求设置头
关于HttpClient方式模拟http请求,请求头以及其他参数的设置. 本文就暂时不给栗子了,当作简版参考手册吧. 发送请求是设置请求头:header HttpClient httpClient = ...
- offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- jquery ajax请求方式与提示用户正在处理请稍等,等待数据返回时loading的显示
1.jquery ajax请求方式与提示用户正在处理请稍等 为了提高用户体验度,我们通常会给出 “正在处理,请稍等!”诸如此类的提示.我们可通过设置$.ajax()下的参数beforeSend()来实 ...
- C# Winform利用POST传值方式模拟表单提交数据(Winform与网页交互)
其原理是,利用winfrom模拟表单提交数据.将要提交的參数提交给网页,网页运行代码.得到数据.然后Winform程序将网页的全部源码读取下来.这样就达到windows应用程序和web应用程序之间传參 ...
- 通过jQuery的Ajax方式来提交Form表单
通过jQuery的Ajax方式来提交Form表单 $.ajax({ url:ajaxCallUrl, type:"POST", cache:true, async:false, d ...
- angularjs简单实现$http.post(CORS)跨域及$http.post传参方式模拟jQuery.post
1.开启angularjs的CORS支持 .config(function($httpProvider) { // CORS post跨域配置 $httpProvider.defaults.useXD ...
- jQuery 方式模拟提交表单
//add test moudle define(function(require , exports , module) { //=========== 不使用模块化只使用如下代码即可 start ...
随机推荐
- Javascript之运动框架2
运动框架2与运动框架1的不同之处在于,运动框架2是框架1的升级版,首先完善了传入值,改为move(obj,json,options),在options里面,可以选择传入或者不传入时间,运动形式,以及函 ...
- Windows Store App 控件动画
在开发Windows应用商店应用时,开发工具中已经封装了大量的控件供开发人员使用,而其中有一部分控件,例如FlipView.ToolTip.ListView以及SemanticZoom等控件中已经默认 ...
- Octopus系列之模板快速开发手册
公共代码 html_header_1 <title>${sitename}-${seotitle}</title> <meta http-equiv="Cont ...
- 利用OVER开窗函数分页
在SQL Server中,利用SQL进行分页的方法也有很多,今天要总结的是SQL Server 2005中引入的OVER开窗口函数,然后利用开窗函数进行分页. 示例代码如下: -- 设置数据库上下文 ...
- C#驱动及应用
一,使用开源客户端:StackExchange.Redis 二,使用方法: 1,获取访问redis数据库连接,代码如下. /// <summary> /// 获取访问redis数据 ...
- WCF初探-4:WCF消息交换模式之请求与答复模式
请求与答复模式( Request/Reply) 这种交换模式是使用最多的一中,它有如下特征: 调用服务方法后需要等待服务的消息返回,即便该方法返回 void 类型 相比Duplex来讲,这种模式强调的 ...
- WCF 断点不会命中
VS的调试模式改为Debug 工具—选项—调试—常规中的‘要求源文件和原始版本完全匹配’的勾去掉
- SQL分类
SQL(Structure Query Language)结构化查询语言,是使用关系型数据库的应用语言. SQL主要可以划分为以下三个类别: DDL(Data Define Language)语句:数 ...
- 多个微信菜单都需要获取openId的时候如何处理回调页面的问题
1.要建立一个特殊的页面处理这个逻辑 if (taskClassId == "6027") { Response.Redirect("./ProductAdvice.as ...
- Context的使用(转)
1.Context概念 Context,相信不管是第一天开发Android,还是开发Android的各种老鸟,对于Context的使用一定不陌生~~你在加载资源.启动一个新的Activity.获取系统 ...