标签:
1、done:延迟成功时,调用函数或数组函数
$.get("test.php").done(function() { alert("$.get succeeded"); });
2、fail:延迟失败时调用
$.get("test.php") .done(function(){ alert("$.get succeeded"); })//延迟成功 .fail(function(){ alert("$.get failed!"); });//延迟失败
3、reject:切换状态,未完成到已失败
4、rejectWith:比reject多了上下文
5、resolve:切换状态,未完成改为已完成
6、resolveWith:比reslove多了上下文
7、then:添加处理程序被调用时,递延对象得到解决或者拒绝
done和fail和在一起,then(successFunc, failureFunc), 如果只有一个参数,则是done
8、always:不管调用的是deferred.resolve()还是deferred.reject(),都会执行。
9、promise:保证目前的执行状态----也就是"未完成"----不变,从而确保只有操作完成后,才会触发回调函数
10、notify:调用then,progress的回调函数
11、notifyWith:加个上下文
12、progress:未完成时,执行progress的回调函数
总结:
done/fail/progress 是 callbacks.add,将回调函数存入
resolve/reject/notify 是 callbacks.fire,执行回调函数(或队列)
很好地教程:jquery的deferred对象详解 http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html
deferred:异步或同步耗时操作的回调函数解决方案
提高可读性
ajax的操作:$.ajax()操作完成后,如果使用的是低于1.5.0版本的jQuery,返回的是XHR对象,你没法进行链式操作;如果高于1.5.0版本,返回的是deferred对象,可以进行链式操作。
$.ajax({ url: "test.html", success: function(){ alert("哈哈,成功了!"); }, error:function(){ alert("出错啦!"); } });
新的写法:简洁多了,代码可读性大大提高
$.ajax("test.html") .done(function(){ alert("哈哈,成功了!"); }) // success .fail(function(){ alert("出错啦!"); }); //error
可加多个回调函数:按添加顺序执行;如果第一个耗时,第二个会等吗?
$.ajax("test.html") .done(function(){ alert("哈哈,成功了!");} ) .fail(function(){ alert("出错啦!"); } ) .done(function(){ alert("第二个回调函数!");} );
为多个操作加回调:
//先执行两个操作$.ajax("test1.html")和$.ajax("test2.html"),如果都成功了,就运行done()指定的回调函数;如果有一个失败或都失败了,就执行fail()指定的回调函数。
// when是一个工具方法
$.when($.ajax("test1.html"), $.ajax("test2.html")) .done(function(){ alert("哈哈,成功了!"); }) .fail(function(){ alert("出错啦!"); });
本地操作:
// 改写wait函数,使其返回deferred对象,才能使用when函数
var dtd = $.Deferred(); // 新建一个deferred对象 var wait = function(dtd){ var tasks = function(){ alert("执行完毕!"); dtd.resolve(); // 改变deferred对象的执行状态 }; setTimeout(tasks,5000); return dtd; };
// 参数为deferred $.when(wait(dtd)) .done(function(){ alert("哈哈,成功了!"); }) .fail(function(){ alert("出错啦!"); });
deferred对象三种状态:未完成(progress),已完成(done),已失败(fail)。
前面部分的ajax操作时,deferred对象会根据返回结果,自动改变自身的执行状态;但是,在wait()函数中,这个执行状态必须由程序员手动指定。dtd.resolve()的意思是,将dtd对象的执行状态从"未完成"改为"已完成",从而触发done()方法。
promise():如上dtd是一个全局对象,可以从外部修改其状态。此时就需要promise,它在原来的deferred对象上返回另一个deferred对象,后者只开放与改变执行状态无关的方法(比如done()方法和fail()方法),屏蔽与改变执行状态有关的方法(比如resolve()方法和reject()方法),从而使得执行状态不能被改变。
var dtd = $.Deferred(); // 新建一个Deferred对象 var wait = function(dtd){ var tasks = function(){ alert("执行完毕!"); dtd.resolve(); // 改变Deferred对象的执行状态 }; setTimeout(tasks,5000); return dtd.promise(); // 返回promise对象 }; var d = wait(dtd); // 新建一个d对象,改为对这个对象进行操作 $.when(d) .done(function(){ alert("哈哈,成功了!"); }) .fail(function(){ alert("出错啦!"); }); d.resolve(); // 此时,这个语句是无效的
更好的写法:把dtd变为wait的内部对象
var wait = function(dtd){ var dtd = $.Deferred(); //在函数内部,新建一个Deferred对象 var tasks = function(){ alert("执行完毕!"); dtd.resolve(); // 改变Deferred对象的执行状态 }; setTimeout(tasks,5000); return dtd.promise(); // 返回promise对象 }; $.when(wait()) .done(function(){ alert("哈哈,成功了!"); }) .fail(function(){ alert("出错啦!"); });
另一种写法:更简洁,不用新建deferred对象了,这种最好了。
$.Deferred(wait) .done(function(){ alert("哈哈,成功了!"); }) .fail(function(){ alert("出错啦!"); });
$.Deferred()可以接受一个函数名(注意,是函数名)作为参数,$.Deferred()所生成的deferred对象将作为这个函数的默认参数。
再一种写法:在wait对象上部署deferred接口
var dtd = $.Deferred(); // 生成Deferred对象 var wait = function(dtd){ var tasks = function(){ alert("执行完毕!"); dtd.resolve(); // 改变Deferred对象的执行状态 }; setTimeout(tasks,5000); };
// 在wait对象上部署Deferred接口 dtd.promise(wait); wait.done(function(){ alert("哈哈,成功了!"); }) .fail(function(){ alert("出错啦!"); }); wait(dtd);
标签:
原文地址:http://www.cnblogs.com/wang-jing/p/4809929.html