jquery 手册
Ajax
属性(Attributes)
回调对象(Callbacks ..
核心(Core)
CSS
数据(Data)
延迟对象(Deferred o ..
尺寸(Dimensions)
效果(Effects)
事件(Events)
表单(Forms)
文档操作(Manipulati ..
杂项(Miscellaneou ..
位置(Offset)
插件编写(Plugin Aut ..
属性(Properties)
选择器(Selectors)
遍历(Traversing)
工具(Utilities)

Returns: PromisePromise .promise( String type, Object target )

描述: 返回一个承诺对象,用于观察绑定到集合或队列上的所有动作的完成时间。
  • version added: 1.6
  • .promise( String type, Object target )
  • type 需要观察的队列类型。
    target 对象,用于附加承诺的方法

.promise() 一旦绑定到集合或队列上的所有动作完成,该方法返回一个动态生成的已解决的承诺。

默认情况下, type"fx", 意思是:当选择元素集的所有动作完成时返回已解决的承诺。

如果提供了target.promise() 将附加方法到上面然后返回这个对象而不是创建一个新的。 这个在附加Promise到一个已存在的对象上市很有用的。

Examples:

例子:

使用在没有动作的集合上, .promise()方法返回一个已解决的承诺:
var div = $( "<div />" );

div.promise().done(function( arg1 ) {
  // will fire right away and alert "true"
  alert( this === div && arg1 === div );
});

例子:

处理返回的承诺当所有动画结束时:
<!DOCTYPE html>
<html>
<head>
  <script src="../jquery.min.js"></script>
  <style>div {
  height: 50px; width: 50px;
  float: left; margin-right: 10px;
  display: none; background-color: #090;
}</style>
</head>
<body>
  
<button>Go</button>
<p>Ready...</p>
<div></div>
<div></div>
<div></div>
<div></div>


  <script>$("button").bind( "click", function() {
  $("p").append( "Started...");
  
  $("div").each(function( i ) {
    $( this ).fadeIn().fadeOut( 1000 * (i+1) );
  });

  $( "div" ).promise().done(function() {
    $( "p" ).append( " Finished! " );
  });
});</script>
</body>
</html>

Demo:

Example:

$.when()处理返回的承诺:
<!DOCTYPE html>
<html>
<head>
  <script src="../jquery.min.js"></script>
  <style>div {
  height: 50px; width: 50px;
  float: left; margin-right: 10px;
  display: none; background-color: #090;
}</style>
</head>
<body>
  
<button>Go</button>
<p>Ready...</p>
<div></div>
<div></div>
<div></div>
<div></div>


  <script>var effect = function() {
  return $("div").fadeIn(800).delay(1200).fadeOut();
};

$("button").bind( "click", function() {
  $("p").append( " Started... ");

  $.when( effect() ).done(function() {
    $("p").append(" Finished! ");
  });
});</script>
</body>
</html>

Demo: