var userProgress = $.Deferred();
var $profileFields = $("input");
var totalFields = $profileFields.length
userProgress.progress(function (filledFields) {
var pctComplete = (filledFields/totalFields)*100;
$("#progress").html(pctComplete.toFixed(0));
});
userProgress.done(function () {
$("#thanks").html("Thanks for completing your profile!").show();
});
$("input").on("change", function () {
var filledFields = $profileFields.filter("[value!='']").length;
userProgress.notify(filledFields);
if (filledFields == totalFields) {
userProgress.resolve();
}
});
then()
then()的作用也是指定回调函数，它可以接受三个参数，也就是三个回调函数。第一个参数是resolve时调用的回调函数，第二个参数是reject时调用的回调函数，第三个参数是progress()方法调用的回调函数。
复制代码 代码如下:
deferred.then( doneFilter [, failFilter ] [, progressFilter ] )
在jQuery 1.8之前，then()只是.done().fail()写法的语法糖，两种写法是等价的。在jQuery 1.8之后，then()返回一个新的deferred对象，而done()返回的是原有的deferred对象。如果then()指定的回调函数有返回值，该返回值会作为参数，传入后面的回调函数。
复制代码 代码如下:
var defer = jQuery.Deferred();
defer.done(function(a,b){
return a * b;
}).done(function( result ) {
console.log("result = " + result);
}).then(function( a, b ) {
return a * b;
}).done(function( result ) {
console.log("result = " + result);
}).then(function( a, b ) {
return a * b;
}).done(function( result ) {
console.log("result = " + result);
});
defer.resolve( 2, 3 );
在jQuery 1.8版本之前，上面代码的结果是：
复制代码 代码如下:
result = 2
result = 2
result = 2
在jQuery 1.8版本之后，返回结果是
复制代码 代码如下:
result = 2
result = 6
result = NaN
这一点需要特别引起注意。
复制代码 代码如下:
$.ajax( url1, { dataType: "json" } )
.then(function( data ) {
return $.ajax( url2, { data: { user: data.userId } } );
}).done(function( data ) {
// 从url2获取的数据
});
上面代码最后那个done方法，处理的是从url2获取的数据，而不是从url1获取的数据。
利用then()会修改返回值这个特性，我们可以在调用其他回调函数之前，对前一步操作返回的值进行处理。
复制代码 代码如下:
var post = $.post("/echo/json/")
.then(function(p){
return p.firstName;
});
post.done(function(r){ console.log(r); });
上面代码先使用then()方法，从返回的数据中取出所需要的字段（firstName），所以后面的操作就可以只处理这个字段了。
有时，Ajax操作返回json字符串里面有一个error属性，表示发生错误。这个时候，传统的方法只能是通过done()来判断是否发生错误。通过then()方法，可以让deferred对象调用fail()方法。
复制代码 代码如下:
var myDeferred = $.post('/echo/json/', {json:JSON.stringify({'error':true})})
.then(function (response) {
if (response.error) {
return $.Deferred().reject(response);
}
return response;
},function () {
return $.Deferred().reject({error:true});
}
);
myDeferred.done(function (response) {
$("#status").html("Success!");
}).fail(function (response) {
$("#status").html("An error occurred");
});
always()
always()也是指定回调函数，不管是resolve或reject都要调用。
pipe方法