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的更多相关文章

  1. jQuery效果之封装模拟placeholder效果,让低版本浏览器也支持

    页面中的输入框默认的提示文字一般使用placeholder属性就可以了,即: <input type="text" name="username" pla ...

  2. HttpClient方式模拟http请求

    方式一:HttpClient import org.apache.commons.lang.exception.ExceptionUtils; import org.apache.http.*; im ...

  3. HttpClient方式模拟http请求设置头

    关于HttpClient方式模拟http请求,请求头以及其他参数的设置. 本文就暂时不给栗子了,当作简版参考手册吧. 发送请求是设置请求头:header HttpClient httpClient = ...

  4. offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. jquery ajax请求方式与提示用户正在处理请稍等,等待数据返回时loading的显示

    1.jquery ajax请求方式与提示用户正在处理请稍等 为了提高用户体验度,我们通常会给出 “正在处理,请稍等!”诸如此类的提示.我们可通过设置$.ajax()下的参数beforeSend()来实 ...

  6. C# Winform利用POST传值方式模拟表单提交数据(Winform与网页交互)

    其原理是,利用winfrom模拟表单提交数据.将要提交的參数提交给网页,网页运行代码.得到数据.然后Winform程序将网页的全部源码读取下来.这样就达到windows应用程序和web应用程序之间传參 ...

  7. 通过jQuery的Ajax方式来提交Form表单

    通过jQuery的Ajax方式来提交Form表单 $.ajax({ url:ajaxCallUrl, type:"POST", cache:true, async:false, d ...

  8. angularjs简单实现$http.post(CORS)跨域及$http.post传参方式模拟jQuery.post

    1.开启angularjs的CORS支持 .config(function($httpProvider) { // CORS post跨域配置 $httpProvider.defaults.useXD ...

  9. jQuery 方式模拟提交表单

    //add test moudle define(function(require , exports , module) { //=========== 不使用模块化只使用如下代码即可 start ...

随机推荐

  1. 计算机上没有找到was服务

    控制面板->程序->打开或关闭windows功能,勾选Microsoft .net framework下的两项.

  2. MFC List Control 控件添加单元格编辑,实现可编辑重写

    在实现随机生成四则运算的个人项目中,目前已经完成基本功能,想要把程序变成一个Windows界面的程序.原本以为学习过MFC,应该很快就能完成.但是由于以前用的都是VC6.0,这次用了VS2010,稍微 ...

  3. HVTableView 分享组

    HVTableView HVTableView是UITableView(带有展开/折叠功能)的子集,可以方便地用在很多app中.开发者可以使用展开/折叠列表而不用为每个单元格创建一个详细的viewCo ...

  4. Java学习指南学习笔记

    1, Java是一种静态类型.动态绑定的语言.具体来说,每一个对象都是编译时确定的良好类型.同时,可以在运行时检查一个对象究竟是什么. 2, Java中除了基本数字类型之外,Java中所有的对象都是通 ...

  5. JavaScript本地对象 内置对象 宿主对象

          在ECMAScript中,所有对象并非同等创建的. 一般来说,可以创建并使用的对象有3种:本地对象.内置对象和宿主对象. 1. 本地对象 ECMA-262把本地对象(native obje ...

  6. 跑马灯标记marquee

    常见属性: direction:滚动方向(left默)/right/up/down; behavior:滚动方式(scroll默)/slide/alternate来回弹动: width.height. ...

  7. AsyncTask的基本使用和各个参数的说明

    AsyncTask 的执行分为四个步骤,每一步都对应一个回调方法,需要注意的是这些方法不应该由应用程序调用,开发者需要做的就是实现这些方法.在任务的执行过程中,这些方法被自动调用. * onPreEx ...

  8. 【转】使用Sublime + PlantUML高效地画图

    project: blog status: publish target: how-to-use-sublime-and-plant-uml-draw-diagram.md date: 2015-12 ...

  9. Java网络应用编程

    1,网络连接 (1)用户向服务器发送请求(Socket); (2)服务器向用户发送信息(ServerSocket),一直监听的话用.accept(); 2,信息发送与接收 (1)客户向服务器端发送信息 ...

  10. Using python to process Big Data

    Pandas is a great lib to process BIg Data. 1) pandas.pivot_table(data,values=None,columns=None,aggfu ...