jQuery.deferred对象使用详解

2020-05-29 07:04:44易采站长站整理

  .done(function(){ alert("success!"); })
  .fail(function(){ alert("error!"); });

2.3.非Ajax操作的回调函数
deferred对象的好处之三,就是它不再拘泥于ajax操作,任意的操作(ajax操作or本地操作/异步操作or同步操作)都可以使用deferred对象,指定回调函数。

一个很典型的耗时操作


var dfd = $.Deferred(); // create a deferred object
  var wait = function(dtd){
    var tasks = function(){
      alert("over!");
      dtd.resolve(); // change the state of the deferred object from pending to resolved
    };
    setTimeout(tasks,50000);
    return dtd;
  };


$.when(wait(dtd))
  .done(function(){ alert("success!"); })
  .fail(function(){ alert("error!"); });

2.4.链式调用
jQuery中传统的ajax操作是这样的:


$.ajax({
url: "",
   success: function(){
    alert("success!");
   },
   error:function(){
    alert("error!");
   }
});

其中success指定ajax操作成功后的回调函数,error指定ajax操作失败后的回调函数。jQuery1.5版本之前,Ajax操作返回的是一个XMLHTTPRequest对象,不支持链式操作。1.5版本开始,ajax操作返回的是jqXHR对象,这是一个deferred对象,而deferred对象一个显著的好处就是可以进行链式操作,因为deferred对象的所有方法返回的均是deferred对象。

现在的ajax操作的写法是:


$.ajax({})
  .done(function(){ alert("success!"); })
  .fail(function(){ alert("fail!"); });

两种写法对比可以很明显的看出来,done()相当于传统ajax操作的success方法,fail()相当于传统ajax操作的fail方法。相对于传统的写法,代码可读性提高了。

3.deferred对象的方法
3.1基本用法
(1).生成deferred对象

var dfd = $.Deferred(); //create a deferred object
(2).deferred对象的状态

deferred对象有三种状态

pending:表示操作处于未完成的状态,任何deferred(延迟)对象开始于pending状态。
resolved:表示操作成功。
rejected:表示操作失败。
state()方法返回deferred对象的当前状态。


$.Deferred().state(); // 'pending'
$.Deferred().resolve().state(); // 'resolved'
$.Deferred().reject().state(); // 'rejected'

(3).改变deferred对象的状态

调用deferred.resolve() 或者 deferred.resolveWith()转换Deferred(递延)到resolved(解决)的状态,并立即执行设置中任何的doneCallbacks。