Jquery Ajax学习实例7 Ajax所有过程事件分析示例


Posted in Javascript onMarch 23, 2010

一、Ajax所有过程事件分析

   JQuery在执行Ajax的过程中会触发很多事件。
   这些事件可以分为两种事件,一种是局部事件(Local),一种是全局事件(Global)。
   局部事件:可以通过$.ajax来调用,你某一个Ajax请求不希望产生全局的事件,则可以设置global:false。
   全局事件:跟click等事件类似,可以绑定到到每一个DOM元素上。
   这些事件的按照事件的触发顺序如下介绍:

 

局部事件(Local) 全局事件(Global)
ajaxStart 全局事件开始新的Ajax请求,并且此时没有其他ajax请求正在进行。
beforeSend 局部事件当一个Ajax请求开始时触发。如果需要,你可以在这里设置XHR对象。 ajaxSend 全局事件请求开始前触发的全局事件。
success 局部事件请求成功时触发。即服务器没有返回错误,返回的数据也没有错误。 ajaxSuccess 全局事件全局的请求成功。
error 局部事件仅当发生错误时触发。你无法同时执行success和error两个回调函数。 ajaxError 全局事件全局的发生错误时触发。
complete 局部事件不管你请求成功还是失败,即便是同步请求,你都能在请求完成时触发这个事件。 ajaxComplete 全局事件全局的请求完成时触发。
ajaxStop 全局事件当没有Ajax正在进行中的时候,触发。
注:除了ajaxStart和ajaxStop之外,其他的事件都有3个参数event, XMLHttpRequest, ajaxOptions第一个是事件,第二个是XHR对象,第三个参数最有用,是当时调用这个ajax的时候的参数。对于ajaxError,还有第四个参数thrownError,只有当异常发生时才会被传递。

 

二、Ajax所有过程事件示例

2.1、HTML代码

      <div>

            <input type="button" onclick="BtnSpareClick();" value="PartEvents" />
            <input type="button" onclick="BtnGlobalClick();" value="GlobalEvents" />

      </div>

       <div id="Result">Result</div>
       <div id="Process">Process</div>

2.2、Jquery Ajax脚本 

局部事件(Local)实例 全局事件(Global)实例
    
Javascript 相关文章推荐
JavaScript中json使用自己总结
Aug 13 Javascript
javascript date格式化示例
Sep 25 Javascript
js+css实现导航效果实例
Feb 10 Javascript
js实现分享到随页面滚动而滑动效果的方法
Apr 10 Javascript
jqueryMobile 动态添加元素,展示刷新视图的实现方法
May 28 Javascript
轻松理解Javascript变量的相关问题
Jan 20 Javascript
JS中Object对象的原型概念基础
Jan 29 Javascript
vue 国际化 vue-i18n 双语言 语言包
Jun 07 Javascript
详解Webstorm 下的Angular2.0开发之路(图文)
Dec 06 Javascript
vue 自定义组件的写法与用法详解
Mar 04 Javascript
原生js+canvas实现验证码
Nov 29 Javascript
vue postcss-px2rem 自适应布局
May 15 Vue.js
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
Mar 23 #Javascript
锋利的jQuery 要点归纳(二) jQuery中的DOM操作(下)
Mar 23 #Javascript
javascript 多浏览器 事件大全
Mar 23 #Javascript
jQuery $.each的用法说明
Mar 22 #Javascript
javascript 用原型继承来实现对象系统
Mar 22 #Javascript
用js实现的自定义的对话框的实现代码
Mar 21 #Javascript
简洁短小的 JavaScript IE 浏览器判定代码
Mar 21 #Javascript
You might like
我的论坛源代码(一)
2006/10/09 PHP
zen_cart实现支付前生成订单的方法
2016/05/06 PHP
PHP实现的随机IP函数【国内IP段】
2016/07/20 PHP
老生常谈PHP面向对象之注册表模式
2017/05/26 PHP
laravel框架中视图的基本使用方法分析
2019/11/23 PHP
Prototype Hash对象 学习
2009/07/19 Javascript
javascript常见操作汇总
2014/09/03 Javascript
实例讲解js验证表单项是否为空的方法
2016/01/09 Javascript
jQuery实现二维码扫描功能
2017/01/09 Javascript
微信小程序 安全包括(框架、功能模块、账户使用)详解
2017/01/16 Javascript
JavaScript仿微信打飞机游戏
2020/07/05 Javascript
JavaScript实现新年倒计时效果
2018/11/17 Javascript
详解在Javascript中进行面向切面编程
2019/04/28 Javascript
Element-ui DatePicker显示周数的方法示例
2019/07/19 Javascript
让Python代码更快运行的5种方法
2015/06/21 Python
使用python读取txt文件的内容,并删除重复的行数方法
2018/04/18 Python
python查看列的唯一值方法
2018/07/17 Python
解决Python print输出不换行没空格的问题
2018/11/14 Python
Python中按值来获取指定的键
2019/03/04 Python
python使用KNN算法识别手写数字
2019/04/25 Python
python中添加模块导入路径的方法
2021/02/03 Python
Python Spyder 调出缩进对齐线的操作
2021/02/26 Python
澳大利亚新奇小玩意网站:Yellow Octopus
2017/12/28 全球购物
请编写一个 C 函数,该函数在给定的内存区域搜索给定的字符,并返回该字符所在位置索引值
2014/09/15 面试题
介绍一下Java中标识符的命名规则
2014/02/03 面试题
应届生污水处理求职信
2013/11/06 职场文书
职务说明书范文
2014/05/07 职场文书
《微笑着面对生活》优秀演讲稿范文
2014/09/23 职场文书
六一儿童节标语
2014/10/08 职场文书
运动会广播稿200字(10篇)
2014/10/12 职场文书
狮子林导游词
2015/02/03 职场文书
奖学金个人总结
2015/03/04 职场文书
医学生自荐信范文
2015/03/05 职场文书
学雷锋献爱心倡议书
2015/04/27 职场文书
贴吧吧主申请感言
2015/08/03 职场文书
分析SQL窗口函数之排名窗口函数
2022/04/21 Oracle