ajax全局事件

摘要:
如果所有执行都完成,jQuery将触发ajaxStop事件,所有处理函数将在此时使用它。ajaxStop()方法已注册并执行。如果在beforeEnd回调函数返回false的情况下取消了未完成的Ajax请求,则还会触发ajaxStop事件。

作用:当你的页面存在很多ajax事件的话,我们有一些信息是公共的,可以复用,我们可以用全局事件进行编写,因为每一个ajax事件调用,都会触发ajax全局事件。

  jquery的ajax方法的全部全局事件:

    ajaxStart:ajax请求开始前

    ajaxSend:ajax请求时

    ajaxSuccess:ajax获取数据后

    ajaxError:ajax请求发生错误后

    ajaxComplete:ajax请求完成时

    ajaxStop:ajax请求停止后

不使用全局事件的做法是:给单个ajax加一个global:false;

  1.ajaxStart

    ajaxStart()方法:每当一个Ajax请求即将发送,jQuery检查是否有任何其他响应过程中的Ajax请求(注:未完成的请求)。如果没有检查到,jQuery就会触发ajaxStart事件,在这个时间点所有处理函数都会使用.ajaxStart()方法注册并执行。如果global选项设置为false,调用$.ajax()$.ajaxStep()方法将不会被触发。

$(document).ajaxStart(function() {
   $( "#loading" ).show();//等待画面
 });

  2.ajaxSend

    .ajaxSend()方法:每当一个Ajax请求即将发送,jQuery就会触发ajaxSend事件,在这个时间点所有处理函数都会使用.ajaxSend()方法注册并执行。如果global选项设置为false,调用$.ajax()$.ajaxStep()方法将不会被触发。

$(document).ajaxSend(function(event, request, settings) {
    $( "#msg" ).append( "<li>Starting request at " + settings.url + "</li>" );
});

  3.ajaxSuccess

    .ajaxSuccess()方法:每当一个Ajax请求成功完成,jQuery就会触发ajaxSuccess事件,在这个时间点所有处理函数都会使用.ajaxSuccess()方法注册并执行。如果global选项设置为false,调用$.ajax()$.ajaxStep()方法将不会被触发。

$(document).ajaxSuccess(function(event, request, settings) {
   $( "#msg" ).append( "<li>Successful Request!</li>" );
 });

  4.ajaxError

    .ajaxError()方法:每当一个Ajax请求出错时,jQuery就会触发ajaxError事件,在这个时间点所有处理函数会使用.ajaxError()方法注册并执行。如果global选项设置为false,调用$.ajax()$.ajaxStep()方法将不会被触发。

$(document).ajaxError(function(event, request, settings) {
  $( "#msg" ).append( "<li>Error requesting page " + settings.url + "</li>" );
});

  5.ajaxComplete

    .ajaxComplete()方法:每当一个Ajax请求完成,jQuery就会触发ajaxComplete事件,在这个时间点所有处理函数会使用.ajaxComplete()方法注册并执行。如果global属性被设置为false,当完成Ajax请求后不会调用这个方法。

$(document).ajaxComplete(function(event,request, settings) {
 $( "#msg" ).append( "<li>请求完成。</li>" );
 });    

  6.ajaxStop

    .ajaxStop()方法:每当一个Ajax请求完成,jQuery检查是否有任何其他响应过程中的Ajax请求(注:未完成的请求)。如果都执行完成,jQuery就会触发ajaxStop事件,在这个时间点所有处理函数都会使用.ajaxStop()方法注册并执行。如果一个未处理完成的Ajax请求用beforeSend回调函数返回false取消,ajaxStop事件也被触发。如果global选项设置为false,调用$.ajax()$.ajaxStep()方法将不会被触发。

$(document).ajaxStop(function() {
      $( "#loading" ).hide();
});ajax

免责声明:文章转载自《ajax全局事件》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇浅析什么是HOOK实验3- 熟悉常用的 HBase 操作下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

JQ之$.ajax()方法以及ajax跨域请求

AJAX(Asynchronous javascript AND xml :异步javascript和xml):是一种创建交互式网页应用的网页开发技术。AJAX可以在不重新加载整个页面的情况下与服务器进行交互。 AJAX的应用范围:   登录失败不跳转页面   注册时验证用户是否存在   图片服务器进行延时加载   多页数据进行翻页   自动制新页面等。...

封装原生Ajax 和 Axios的 二次封装

AJAX 异步的JavaScript与XML技术( Asynchronous JavaScript and XML ) Ajax 核心使用 `XMLHttpRequest` (XHR)对象,首先由微软引入的一个特性;Ajax 不需要任何浏览器插件,能在不更新整个页面的前提下维护数据(可以向服务器请求额外的数据无需重载页面),但需要用户允许JavaScri...

ajax发送请求下载字节流形式的excel文件

背景 开发项目中导出功能,因为数据量有点大,所以导出可能需要时间有点长,所以想用ajax异步请求。 存在问题 利用传统的js和jquery提供的ajax相关获取响应的方式是无法实现excel文件下载的。 js的XMLHttpRequest对象提供了responseText和responseXML两个属性,获取的是html和xml文件格式,没有提供二进制流获...

Ajax动态滚动加载数据

看新浪微博,人人网都有这样的效果:滚动条滚动到最下面的时候,新的数据就被自动加载出来了,今天亲自尝试了一下这个效果的实现。 最开始在CSDN上写了一版,功能比较简单,今天又增加了一个小功能:翻页到指定页数后,自动停止。用户点击继续查看后,再继续滚动。看看实现吧: 更新核心滚动代码: $(window).scroll(function(){...

react异步数据如ajax请求应该放在哪个生命周期?

react请求接口数据是在componentDidMount 还是componentWillMount周期好?React数据获取为什么一定要在componentDidMount里面调用? 对于同步的状态改变,是可以放在componentWillMount,对于异步的,最好好放在componentDidMount。但如果此时有若干细节需要处理,比如你的组件需...

原生JS实现ajax与ajax的跨域请求

一、原生JS实现ajax 第一步获得XMLHttpRequest对象 第二步:设置状态监听函数 第三步:open一个连接,true是异步请求 第四部:send一个请求,可以发送一个对象和字符串,不需要传递数据发送null 第五步:在监听函数中,判断readyState=4&&status=200表示请求成功 第六步:使用responseTe...