监控页面所有 ajax请求
监控所有ajax请求:
你是不是有遇到这样的问题:页面发起两个ajax请求,希望它们都成功以后,再做一个动作?
很容易想到的解决方案是,等其中一个结束以后,再发起另外一个,这个过程用回调函数来完成。
但是,如果其中一个ajax请求的代码不是你写,你改不了,怎么办?
又或者说,你只想知道某个url请求什么时候结束,不想管其他的请求,怎么弄?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
</head>
<body>
<p id="test"></p>
</body>
<script src="js/jquery-1.11.0.min.js"></script>
<!--首先在页面引入jquery的后面,紧接着以下代码:-->
<script>
//前提:所有ajax请求都是用jquery的$.ajax发起的,而非原生的XHR;
var ajaxBack = $.ajax;
var ajaxCount = 0;
var allAjaxDone = function(){$('#test').append('all done!<br>');} //一行代码,就可以知道所有ajax请求什么时候结束
//由于get/post/getJSON等,最后还是调用到ajax,因此只要改ajax函数即可
$.ajax = function(setting){
ajaxCount++;
var cb = setting.complete;
setting.complete = function(){
if($.isFunction(cb)){cb.apply(setting.context, arguments);}
ajaxCount--;
if(ajaxCount==0 && $.isFunction(allAjaxDone)){
allAjaxDone();
}
}
ajaxBack(setting);
}
</script>
<!--以下是别人的script-->
<script>
$.ajax({url: 'js/jquery-1.11.0.min.js', success: function(recv){$('#test').append('别人的ajax请求1,done<br>')}});
</script>
<script>
$.get('css/main.css', null, function(recv){$('#test').append('别人的get请求,done<br>')});
</script>
<script>
$.post('css/main.css', null, function(recv){$('#test').append('别人的post请求,done<br>')});
</script>
</html>
其他的相关函数:
$.ajax 中
error:当出错时调用,可以用来上报错误的请求。
complete:无论成功还是失败都会调用
高版本中:
$.promise
$.when
监控页面所有 ajax请求的更多相关文章
- 转:jquery向普通aspx页面发送ajax请求
本文将介绍在ASP.NET中如何方便使用Ajax,第一种当然是使用jQuery的ajax,功能强大而且操作简单方便,第二种是使用.NET封装好的ScriptManager. $.ajax向普通页面发送 ...
- phpStudy4——前端页面使用Ajax请求并解析php返回的json数据
项目需求: 在html页面显示所有用户列表信息. 需求分析: 1. html页面使用ajax向后端php请求用户数据 2. php脚本查询数据库,并将查询后的结果以json格式返回前端html页面 3 ...
- SpringMVC响应Ajax请求(@Responsebody注解返回页面)
项目需求描述:page1中的ajax请求Controller,Controller负责将service返回的数据填充到page2中,并将page2整个页面返回到page1中ajax的回调函数. 一句话 ...
- 一起来做chrome扩展《AJAX请求》
chrome在一次更新之后,出于安全考虑,完全的禁止了content_script从https向http发起ajax请求,即使正常情况下也会在console里给出提示.这对于WEB来讲是好事,但对于扩 ...
- WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据
WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据 WebForm1.aspx 页面 (原生AJAX请求,写法一) <%@ Page Langu ...
- 黄聪:chrome扩展开发《AJAX请求》
chrome在一次更新之后,出于安全考虑,完全的禁止了content_script从https向http发起ajax请求,即使正常情况下也会在console里给出提示.这对于WEB来讲是好事,但对于扩 ...
- WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据(转)
WebForm.aspx 页面通过 AJAX 访问WebForm.aspx.cs类中的方法,获取数据 WebForm1.aspx 页面 (原生AJAX请求,写法一) <%@ Page Langu ...
- 【转】AJAX请求和普通HTTP请求区别
两者本质区别: AJAX通xmlHttpRequest象请求服务器服务器接受请求返数据实现刷新交互 普通http请求通httpRequest象请求服务器接受请求返数据需要页面刷新 AJAX请求 普通请 ...
- SpringBoot自定义错误信息,SpringBoot适配Ajax请求
SpringBoot自定义错误信息,SpringBoot自定义异常处理类, SpringBoot异常结果处理适配页面及Ajax请求, SpringBoot适配Ajax请求 ============== ...
随机推荐
- 移动端动画使用transform提升性能
在移动端做动画,对性能要求较高而通常的改变margin属性是性能极低的,即使使用绝对定位改变top,left这些属性性能也很差因此应该使用transform来进行动画效果,如transform:tra ...
- 学习ARM7、ARM9的操作系统选择经验! [转]
一 首先说说ARM的发展 可以用一片大好来形容,翻开各个公司的网站,招聘里面嵌入式占据了大半工程师职位.广义的嵌入式无非几种:传统的什么51.AVR.PIC称做嵌入式微控制器:ARM是嵌 ...
- eclipse关掉jsp,js的语法验证
转载:http://blog.csdn.net/testcs_dn/article/details/39058959 eclipse加速之禁用JS.jsp等文件的语法验证 去除eclipse的JS验证 ...
- IntelliJ IDEA 开发前的设置
1.IntelliJ IDEA 显示行号方法 设置方法:File->Settings->Editor->General->Appearance->Show line nu ...
- background-position 用法详细介绍
语法: background-position : length || length background-position : position || position 取值: length : ...
- Linux进程间通信-匿名管道
前面我们讲了进程间通信的一种方式,共享内存.下面看一看另一种机制,匿名管道.1.什么是管道管道是一个进程的数据流到另一个进程的通道,即一个进程的数据输出作为另一个进程的数据输入,管道起到了桥梁的作用. ...
- SqlBulkCopy 批量插入数据库
/// <summary> /// 批量插入 注:DT的tableName为要更新的数据库表名,DT的列名和数据库一致 /// </summary> /// <param ...
- java之yield(),sleep(),wait()区别详解-备忘笔记
备注:转载地址,http://dylanxu.iteye.com/blog/1322066,谢谢作者 1.sleep() 使当前线程(即调用该方法的线程)暂停执行一段时间,让其他线程有机会继续执行,但 ...
- EDIUS如何实现抠图
有时候我们把素材图片导入到EDIUS中会发现图片的背景有点不合适,这时候就会想替换掉这个背景.那么EDIUS也可以像PS一样替换掉背景吗?答案当然是肯定的,现在小编就带领你们一起来学习EDIUS抠图吧 ...
- caller 属性和callee属性
1.caller 属性 返回一个对函数的引用,即调用了当前函数的函数体. functionName.caller :functionName 对象是所执行函数的名称. 说明: 对于函数来说,calle ...