deferred.then()


html+div+css+天猫商城
html5+css3+京东手机网站
javascript+jquery+ajax
正则表达式+面向对象+js插件
2D+3D+触屏事件+Canvas+Svg
地理信息+本地存储+H5拖拽api
查看课程大纲

deferred.then( doneFilter [, failFilter ] [, progressFilter ] )返回: Promise

描述: 当Deferred(延迟)对象解决,拒绝或仍在进行中时,调用添加处理程序。

  • 添加的版本: 1.8deferred.then( doneFilter [, failFilter ] [, progressFilter ] )

    • doneFilter
      类型: Function()
      当Deferred(延迟)对象得到解决时被调用的一个函数。
    • failFilter
      类型: Function()
      [可选]当Deferred(延迟)对象拒绝时被调用的一个函数。
    • progressFilter
      类型: Function()
      [可选]当Deferred(延迟)对象生成进度通知时被调用的一个函数。
  • 添加的版本: 1.5, removed: 1.8deferred.then( doneCallbacks, failCallbacks )

    • doneCallbacks
      类型: Function()
      当Deferred(延迟)对象得到解决时被调用的一个函数或函数数组。
    • failCallbacks
      类型: Function()
      当Deferred(延迟)对象拒绝时被调用的一个函数或函数数组。
  • 添加的版本: 1.7, removed: 1.8deferred.then( doneCallbacks, failCallbacks [, progressCallbacks ] )

    • doneCallbacks
      类型: Function()
      当Deferred(延迟)对象得到解决时被调用的一个函数或函数数组。
    • failCallbacks
      类型: Function()
      当Deferred(延迟)对象拒绝时被调用的一个函数或函数数组。
    • progressCallbacks
      类型: Function()
      当Deferred(延迟)对象生成进度通知时被调用的一个函数或函数数组。

在jQuery 1.8之前,参数可以是一个函数或函数数组。

对于上面所有的特征,如果没有这种类型的回调是需要的,参数可以为null。或者,使用.done().fail()或者 .progress()设置只有一种未经过滤的状态或值的回调类型。

从jQuery 1.8开始, 方法返回一个新的promise(承诺),通过一个函数,可以过滤deferred(延迟)的状态和值。替换现在过时的deferred.pipe()方法。 doneFilterfailFilter函数过滤原deferred(延迟)的解决/拒绝的状态和值。 progressFilter 函数过滤器的任何调用到原有的deferred(延迟)的notifynotifyWith的方法。 这些过滤器函数可以返回一个新的值传递给的 promise(承诺)的.done().fail() 回调,或他们可以返回另一个观察的对象(递延,承诺等)传递给它的解决/拒绝的状态和值promise(承诺)的回调。 如果过滤函数是空,或没有指定,promise(承诺)将得到与原来值相同解决(resolved)或拒绝(rejected)。

回调是依照他们添加的顺序执行的。一旦deferred.then返回Promise(承诺),链接其它的延迟对象,包括增加.then()方法。有关详细信息,请参阅文件Deferred object

例子:

Example: 由于 jQuery.get 方法返回 jqXHR 对象,该对象继承自延迟对象,所以我们可以添加 .then 方法。

1
2
3
4
$.get("test.php").then(
function(){ alert("$.get succeeded"); },
function(){ alert("$.get failed!"); }
);

Example: Filter the resolve value:

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
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<button>Filter Resolve</button>
<p></p>
<script>
var filterResolve = function() {
var defer = $.Deferred(),
filtered = defer.then(function( value ) {
return value * 2;
});
defer.resolve( 5 );
filtered.done(function( value ) {
$( "p" ).html( "Value is ( 2*5 = ) 10: " + value );
});
};
$( "button" ).on( "click", filterResolve );
</script>
</body>
</html>

Demo:

Example: Filter reject value:

1
2
3
4
5
6
7
8
9
var defer = $.Deferred(),
filtered = defer.then( null, function( value ) {
return value * 3;
});
defer.reject( 6 );
filtered.fail(function( value ) {
alert( "Value is ( 3*6 = ) 18: " + value );
});

Example: Chain tasks:

1
2
3
4
5
6
7
8
9
var request = $.ajax( url, { dataType: "json" } ),
chained = request.then(function( data ) {
return $.ajax( url2, { data: { user: data.userId } } );
});
chained.done(function( data ) {
// data retrieved from url2 as provided by the first request
});