ajax的传统写法:

$.ajax({
url: "test.html",
success: function(){
alert("哈哈,成功了!");
},
error:function(){
alert("出错啦!");
}
});

Jquery版本在1.5之前,返回的是XHR对象;当版本高于1.5之后,返回的是deferred对象,可以使用 done 和 fail。

所以新的写法如下:

$.ajax("test.html")
  .done(function(){ alert("哈哈,成功了!"); })
  .fail(function(){ alert("出错啦!"); });

可以有多个done,按照顺序执行。

$.ajax("test.html")
  .done(function(){ alert("哈哈,成功了!");} )
  .fail(function(){ alert("出错啦!"); } )
  .done(function(){ alert("第二个回调函数!");} );

有时为了省事,可以把done()和fail()合在一起写,这就是then()方法。

$.ajax("test.html")
.then(function(){ alert("哈哈,成功了!"); },
function(){ alert("出错啦!"); }
);

$.when为多个事件指定相同的回调:

$.when($.ajax("test1.html"),
$.ajax("test2.html"))
   .done(function(){ alert("哈哈,成功了!"); })
   .fail(function(){ alert("出错啦!"); });

将普通的异步函数改装成deferred对象来使用$.when:

var wait = function(){
setTimeout(function(){
    alert("执行完毕!");
  },5000);
};

在未改装前使用无效:(原因在于$.when()的参数只能是deferred对象)

$.when(wait())
  .done(function(){ alert("哈哈,成功了!"); })
  .fail(function(){ alert("出错啦!"); });

对wait()函数进行改装:

var wait = function(){
let df = $.Deferred(); // 新建一个deferred对象
setTimeout(function(){
alert("执行完毕!");
df.resolve(); // 将df对象的执行状态从"未完成"改为"已完成",从而触发done()方法。
// df.reject(); // 将df对象的执行状态从"未完成"改为"已失败",从而触发fail()方法。
  },5000); return df; // 现在返回的就是deferred对象了
};

然后就可以使用了:

$.when(wait())
  .done(function(){ alert("哈哈,成功了!"); })
  .fail(function(){ alert("出错啦!"); });

参考链接

http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html

Jquery中的done() fail() then() $when()到底是什么的更多相关文章

  1. Ajax跨域原理及JQuery中的实现

    浅析Ajax跨域原理及JQuery中的实现分析   AJAX 的出现使得网页可以通过在后台与服务器进行少量数据交换,实现网页的局部刷新.但是出于安全的考虑,ajax不允许跨域通信.如果尝试从不同的域请 ...

  2. jQuery中的编程范式

    浏览器前端编程的面貌自2005年以来已经发生了深刻的变化,这并不简单的意味着出现了大量功能丰富的基础库,使得我们可以更加方便的编写业务代码,更重要的是我们看待前端技术的观念发生了重大转变,明确意识到了 ...

  3. jQuery 中的编程范式

    浏览器前端编程的面貌自2005年以来已经发生了深刻的变化,这并不简单的意味着出现了大量功能丰富的基础库,使得我们可以更加方便的编写业务代码,更重要的是我们看待前端技术的观念发生了重大转变,明确意识到了 ...

  4. jquery中的编程范式,即jquery的牛逼之处

    转自:http://www.iteye.com/topic/1119283 对jquery理解比较深,积累一下,整理了一下格式,就当练习一下 markdown 语法. 本文将结合jQuery源码的实现 ...

  5. jQuery中的100个技巧

      1.当document文档就绪时执行JavaScript代码. 我们为什么使用jQuery库呢?原因之一就在于我们可以使jQuery代码在各种不同的浏览器和存在bug的浏览器上完美运行. < ...

  6. jQuery中Animate进阶用法(一)

    jQuery中animate的用法你了解多少呢?如果仅仅是简单的移动位置,显示隐藏,哦!天哪你在浪费资源!因为animate太强大了,你可以有很多意想不到的用法!让我们一起研究一下吧~~ 首先要了解j ...

  7. 大白话讲解Promise(三)搞懂jquery中的Promise

    前两篇我们讲了ES6中的Promise以及Promise/A+规范,在Promise的知识体系中,jquery当然是必不可少的一环,所以本篇就来讲讲jquery中的Promise,也就是我们所知道的D ...

  8. jQuery中异步操作对象Deferred

    以下介绍一下jQuery中Deferred对象的使用: 1. 通过$.Deferred生成一个deferredObj对象; 2. deferredObj.done()指定操作成功时的回调函数; 3. ...

  9. Javascript事件模型系列(三)jQuery中的事件监听方式及异同点

    作为全球最知名的js框架之一,jQuery的火热程度堪称无与伦比,简单易学的API再加丰富的插件,几乎是每个前端程序员的必修课.从读<锋利的jQuery>开始,到现在使用jQuery有一年 ...

随机推荐

  1. SSM非springboot配置swagger2

    前提:maven,ssm,不是springboot项目 1.在maven中添加依赖 <!-- Swagger2 Begin --> <!--springfox的核心jar包--> ...

  2. 松软科技Web课堂:JavaScript For 循环

    循环可多次执行代码块. JavaScript 循环 假如您需要运行代码多次,且每次使用不同的值,那么循环(loop)相当方便使用. 通常我们会遇到使用数组的例子: 不需要这样写: text += ca ...

  3. DG重启之后主备数据不同步

    问题描述:本来配置好的DG第二天重启之后,发现主备库数据不能同步,在主库上执行日志切换以及创建表操作都传不到备库上,造成这种错误的原因是主库实例断掉后造成备库日志与主库无法实时接收 主库:orcl  ...

  4. 集合系列 Map(十四):WeakedHashMap

    WeakedHashMap 也是 Map 集合的哈希实现,但其余 HashMap 的不同之处在于.其每个节点的 value 引用是弱引用,可以方便 GC 回收. public class WeakHa ...

  5. Git常用进阶操作之一

    提起Git,经常做项目的我们都不陌生,我们常用的功能有哪些呢? 这里按个人使用情况简单总结一下. 像新建远程仓库.新建分支这些就不说了,不熟的同学可以翻看我前面写的git基本操作. 1.首先提一下为每 ...

  6. vue-element-admin在install的时候关于sass的错误信息

    vue-element-admin在install的是报关于sass的错误信息 今天使用vue-element-admin给自己弄的一个微信小程序编写一个后台管理系统的时候,报关于sass的错误,下载 ...

  7. React的setState学习及应用

    React的setState学习及应用 一:作用: setState() 将对组件 state 的更改排入队列,并通知 React 需要使用更新后的 state 重新渲染此组件及其子组件.这是用于更新 ...

  8. Spring注解之@Component详细解析

    @controller 控制器(注入服务) 2.@service 服务(注入dao) 3.@repository dao(实现dao访问) 4.@component (把普通pojo实例化到sprin ...

  9. [转载] redis学习入门 Redis 3.2.100

    参考博客: https://blog.csdn.net/flyer_tang/article/details/80320974 https://blog.csdn.net/weixin_3077313 ...

  10. CAS与ABA问题产生和优雅解决

    本人免费整理了Java高级资料,涵盖了Java.Redis.MongoDB.MySQL.Zookeeper.Spring Cloud.Dubbo高并发分布式等教程,一共30G,需要自己领取.传送门:h ...