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")});