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


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM