jQuery的deferred对象使用详解

2020-05-23 06:22:02易采站长站整理


  .fail(function(){ alert(“出错啦!”); });


(运行代码示例2)


    可以看到,done()相当于success方法,fail()相当于error方法。采用链式写法以后,代码的可读性大大提高。


三、指定同一操作的多个回调函数


    deferred对象的一大好处,就是它允许你自由添加多个回调函数。


还是以上面的代码为例,如果ajax操作成功后,除了原来的回调函数,我还想再运行一个回调函数,怎么办?


很简单,直接把它加在后面就行了。


  $.ajax(“test.html”)


  .done(function(){ alert(“哈哈,成功了!”);} )


  .fail(function(){ alert(“出错啦!”); } )


  .done(function(){ alert(“第二个回调函数!”);} );


(运行代码示例3)


回调函数可以添加任意多个,它们按照添加顺序执行。


四、为多个操作指定回调函数


    deferred对象的另一大好处,就是它允许你为多个事件指定一个回调函数,这是传统写法做不到的。


    请看下面的代码,它用到了一个新的方法$.when():


  $.when($.ajax(“test1.html”), $.ajax(“test2.html”))


  .done(function(){ alert(“哈哈,成功了!”); })


  .fail(function(){ alert(“出错啦!”); });


(运行代码示例4)


    这段代码的意思是,先执行两个操作$.ajax(“test1.html”)和$.ajax(“test2.html”),如果成功了,就运行done()指定的回调函数;如果有一个失败或都失败了,就执行fail()指定的回调函数。


五、普通操作的回调函数接口(上)


    deferred对象的最大优点,就是它把这一套回调函数接口,从ajax操作扩展到了所有操作。也就是说,任何一个操作—-不管是ajax操作还是本地操作,也不管是异步操作还是同步操作—-都可以使用deferred对象的各种方法,指定回调函数。


    我们来看一个具体的例子。假定有一个很耗时的操作wait:


  var wait = function(){


    var tasks = function(){


      alert(“执行完毕!”);


    };


    setTimeout(tasks,5000);


  };


    我们为它指定回调函数,应该怎么做呢?


    很自然的,你会想到,可以使用$.when():


  $.when(wait())


  .done(function(){ alert(“哈哈,成功了!”); })