jquery的deferred使用详解

1.什么是deferred对象
deferred对象是一个延迟对象，意思是函数延迟到某个点才开始执行，改变执行状态的方法有两个（成功：resolve和失败：reject），分别对应两种执行回调（成功回调函数：done和失败回调函数fail）

2.deferred对象使用示例
ajax方式其实是deferred对象
1)普通的ajax操作

$.ajax({
url: "index.html",
success: function () {
alert("success");
},
error: function () {
alert("error");
}
});

success,error函数在请求url响应后才开始执行
2)1.5版本后新的写法

$.ajax("index.html")
.done(function () { alert("success"); })
.fail(function () { alert("error"); })
.done(function () { alert("success2");});

新的写法可以自由添加多个回调函数，按添加的顺序执行。
3)为多个ajax执行回调函数

$.when($.ajax("index.html"), $.ajax("addorder2.html"))
.done(function () { alert("success"); })
.fail(function () { alert("error");})

只有两个ajax都请求成功，才会执行done函数
4)为普通方法指定回调函数

var wait=function(){
var tasks=function(){
alert("执行完毕！");
};
setTimeout(tasks,5000);
};
$.when(wait())
.done(function(){alert("success");})
.fail(function(){alert("error")});

wait不是一个deferred对象，运行后没有等待wait()函数执行结果，先执行回调函数了。

加入deferred对象，代码示例如下：

var dtd=$.Deferred();
var wait=function(dtd){
var tasks=function(){
alert("执行完毕！");
dtd.resolve();
};
setTimeout(tasks,5000);
return dtd;
};
$.when(wait(dtd))
.done(function(){alert("success");})
.fail(function(){alert("error")});

其中$.when()中的参数必须是个deferred对象，
dtd.resolve();改变执行状态为成功，调用done回调函数。
dtd.reject();改变执行状态为失败，调用fail回调函数。
5)deferred对象的promise()方法
上例中，定义了一个全局的deferred对象，在deferred对象wait外部也可以调用改变执行状态函数。
deferred对象调用promise()方法后，就只能执行回调函数(done,fail)了，不能执行状态改变函数(resolve,reject)
代码示例如下：

var wait=function(){
var dtd=$.Deferred();
var tasks=function(){
alert("执行完毕！");
dtd.resolve();
};
setTimeout(tasks,5000);
return dtd.promise();
};
var d=wait();
d.resolve();//执行执行状态改变函数resolve不起任何作用！
$.when(d)
.done(function(){alert("success");})
.fail(function(){alert("error")});

jquery的deferred使用详解相关推荐

jQuery的deferred对象详解
阮一峰大神的关于jQuery的deferred对象详解 http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_ ...
jQuery中deferred对象详解
最近看看构建工具gulp,当看到promise时突然有点陌生,于是乎意外找到了大牛阮一峰的一篇文章,写的非常的通俗易懂,对延迟对象进行了很好的讲解,虽然写的比较早但是道理都一样. 以下为主要内容: 一 ...
【转】4.1触碰jQuery：AJAX异步详解
传送门:异步编程系列目录-- 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 X ...
请求对象触碰jQuery：AJAX异步详解
最近一直在研究请求对象之类的问题,现在正好有机会和大家讨论一下. 传送门:异步编程系列目录-- 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous Java ...
jQuery.extend 函数使用详解
jQuery.extend 函数使用详解一.总结一句话总结: jquery $.extend的作用就是:用于将一个或多个对象的内容合并到目标对象:$.extend( target [, objec ...
jQuery Validate验证框架详解
2019独角兽企业重金招聘Python工程师标准>>> 一.导入js库 <script type="text/javascript" src="& ...
jQuery 表单验证插件，jQuery Validation Engine用法详解
jQuery 表单验证插件,jQuery Validation Engine用法详解功能强大的 jQuery 表单验证插件,适用于日常的 E-mail.电话号码.网址等验证及 Ajax 验证,除自身 ...
atitit.jQuery Validate验证框架详解与ati Validate 设计新特性
atitit.jQuery Validate验证框架详解与ati Validate 设计新特性 1. AtiValidate的目标1 2. 默的认校验规则1 2.1. 使用方式 1.metadata用 ...
最全的jquery datatables api 使用详解
https://www.cnblogs.com/amoniyibeizi/p/4548111.html 最全的jquery datatables api 使用详解学习可参考:http://www.g ...
jQuery form插件使用详解
点击打开: jquery选择器全解 jquery中的style样式操作 jquery中的DOM操作 jquery中的事件操作全解 jquery中的动画操作全解 jquery中ajax的应用自定义jq ...

jquery的deferred使用详解

jquery的deferred使用详解相关推荐

最新文章

热门文章