这篇文章偏重入门实践，学习请点这里：
-jQuery的deferred对象详解——阮一峰
-读jQuery之二十（Deferred对象）——Snandy
骨感的语法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| // ajax请求封装
function getData(){
var dtd = $.Deferred();
$.ajax({url:'test.php'})
.done(function() {dtd.resolve(); }) ---->--------------------+
.fail(function() {dtd.reject(); }); --->----------+ |
return dtd.promise(); | |
} | |
| |
//执行ajax，传入回调函数 | v
function init() { v |
$.when(getData()) | |
.then( | |
function(){}, // 回调函数1，resolve执行 ------+------<---+
function(){} // 回调函数2，reject执行 _______|
);
}
init();
|
有血有肉的demo代码：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
// ajax请求封装
function getData(){
var dtd = $.Deferred();
$.ajax({
url: 'www.baidu.com/test.php',
dataType: 'jsonp', // 可选，跨域
jsonp: 'cb', // 可选，跨域
data: {
action : 'r',
}
}).done(function(data) { // ajax请求成功
if(data.status == '0') {
dtd.resolve(data); // 相当于ajax的success
} else { // 请求返回值异常（如：未登录，无数据，参数异常）
dtd.reject(data); // 相当于ajax的success，只是并未返回预期数据
}
}).fail(function(data) { // ajax请求失败
dtd.reject(data); // 相当于ajax的fail
});
return dtd.promise();
}
// 执行ajax，传入回调函数
function init() {
$.when(getData).then(
function (data){ // 回调函数1，resolve执行
console.log('resolve 处理逻辑执行');
},
function(data) { // 回调函数2，reject执行
console.log('reject 处理逻辑执行');
}
)
}
init();
|
