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. 我学习Python的经历

    1. 被逼无奈找到了Python Python作为当今非常热的话题,常常被各级别的程序员所提到,也有很多的小白问我,到底啥是Python,它能干啥! 我用Python时间不是特别长,最早使用是在201 ...

  2. Android Studio 中java 文件报错红色J

    用常用的方法清除Android Studio的缓存然后重启,"File" -> "Invalidate Cashes / Restart" -> & ...

  3. 由malloc和new引发的段错误

    class Queue{ private: struct node{ string data; struct node * next,*priv; } private: struct node * p ...

  4. 详解EMC测试国家标准GB/T 17626

    电波暗室,用于模拟开阔场,同时用于辐射无线电骚扰(EMI)和辐射敏感度(EMS)测量的密闭屏蔽室. 来源:http://gememc.com/upload/201712/201712010930227 ...

  5. idea创建Maven版的ssm项目

    要使用idea创建一个maven项目,首先电脑安装maven,maven下载地址:http://maven.apache.org/download.cgi 1.打开idea,选择创建一个新项目,选择m ...

  6. Vue+Webpack之 代码及打包优化

    本文重点介绍Vue单页面应用的优化手段: 异步加载 面切换时加loading特效 点击延迟 inline manifest 逻辑代码优化 依赖包体积优化 cdn引用 Vue代码优化 异步加载 所谓的异 ...

  7. Android高斯模糊实现方案

    1.使用Glide Glide.with(this) .load(service.getImageUri()) .dontAnimate() .error(R.drawable.error_img) ...

  8. QT删除整个文件夹

    故事背景:因为客户端要清理旧版本以及日志文件,所以需要删除一个月以前的所有文件夹 技术调研:在程序中我想把文件夹直接删除,但是调用QDir中的rmdir()或者rmpath()时要求文件夹必须是非空的 ...

  9. linux常用命令补充

    linux补充 apt 是在我们Linux系统安装软件 pip 用来安装python3的模块(第三方库)  ps # 查看运行进程(pid) ps aux # 查看全部任务进程 top # 也可以查看 ...

  10. 让 Lua 访问数据库

    Lua 自身并没有提供访问数据库的函数,但是借助外部扩展库我们可以很容易实现对数据库的各种操作,下面就为大家介绍这样一个扩展库 - LuaSQL,你可以在下载区得到它. LuaSQL 定义了一套简单的 ...