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 基础篇1 什么是js 建立第一个js程序
Mar 14 Javascript
Ajax同步与异步传输的示例代码
Nov 21 Javascript
javascript实现禁止复制网页内容汇总
Dec 30 Javascript
javascript自动恢复文本框点击清除后的默认文本
Jan 12 Javascript
Vuejs第六篇之Vuejs与form元素实例解析
Sep 05 Javascript
jquery.multiselect多选下拉框实现代码
Nov 11 Javascript
jq stop()和:is(:animated)的用法及区别(详解)
Feb 12 Javascript
react 创建单例组件的方法
Apr 26 Javascript
CKeditor4 字体颜色功能配置方法教程
Jun 26 Javascript
JS阻止事件冒泡的方法详解
Aug 26 Javascript
微信小程序 导入图标实现过程详解
Oct 11 Javascript
JavaScript实现像雪花一样的Hexaflake分形
Jul 07 Javascript
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
怎样辨别一杯好咖啡
2021/03/03 新手入门
PHP不用第三变量交换2个变量的值的解决方法
2013/06/02 PHP
PHP数据库连接mysql与mysqli对比分析
2016/01/04 PHP
YII2自动登录Cookie总是失效的解决方法
2017/06/28 PHP
Laravel框架文件上传功能实现方法示例
2019/04/16 PHP
解放web程序员的输入验证
2006/10/06 Javascript
Ajax,UTF-8还是GB2312 eval 还是execScript
2008/11/13 Javascript
Document 对象的常用方法
2009/07/31 Javascript
iframe自适应宽度、高度 ie6 7 8,firefox 3.86下测试通过
2010/07/29 Javascript
IE浏览器IFrame对象内存不释放问题解决方法
2014/08/22 Javascript
鼠标悬浮显示二级菜单效果的jquery实现
2014/10/29 Javascript
JavaScript实现判断图片是否加载完成的3种方法整理
2015/03/13 Javascript
javascript数组去重方法汇总
2015/04/23 Javascript
NodeJs中的VM模块详解
2015/05/06 NodeJs
js入门之Function函数的使用方法【新手必看】
2016/11/22 Javascript
BootStrap表单宽度设置方法
2017/03/10 Javascript
Vuex之理解Getters的用法实例
2017/04/19 Javascript
微信小程序 Buffer缓冲区的详解
2017/07/06 Javascript
vue 中directive功能的简单实现
2018/01/05 Javascript
Vue CLI 3搭建vue+vuex最全分析(推荐)
2018/09/27 Javascript
微信小程序制作扭蛋机代码实例
2019/09/24 Javascript
[01:06:32]DOTA2上海特级锦标赛D组资格赛#1 EG VS VP第一局
2016/02/28 DOTA
[06:53]2018DOTA2国际邀请赛寻真——勇于创新的Vici Gaming
2018/08/14 DOTA
Python中用Spark模块的使用教程
2015/04/13 Python
Python json模块dumps、loads操作示例
2018/09/06 Python
PyQt5根据控件Id获取控件对象的方法
2019/06/25 Python
超实用的 30 段 Python 案例
2019/10/10 Python
python编写微信公众号首图思路详解
2019/12/13 Python
Python3 xml.etree.ElementTree支持的XPath语法详解
2020/03/06 Python
python操作toml文件的示例代码
2020/11/27 Python
英国标准协会商店:BSI Shop
2019/02/25 全球购物
广州喜创信息技术有限公司JAVA软件工程师笔试题
2012/10/17 面试题
三好学生自我鉴定
2013/12/17 职场文书
人民调解员先进事迹材料
2014/05/08 职场文书
党员心得体会范文2016
2016/01/23 职场文书
python中 Flask Web 表单的使用方法
2022/05/20 Python