如何终止JQUERY的$.AJAX请求
最近遇到,如果用户频繁点击ajax请求,有两个问题:
1,如果连续点击了5个ajax请求,前4个其实是无效的,趁早结束节省资源。
2,更严重的问题是:最后一个发送的请求,响应未必是最后一个,有可能造成混乱。还需要一个队列来维护发送的请求和响应。
我其实已经设计好了该队列的实现方式,后来发现jQuery直接通过abort方法,这样就不需要那么复杂的实现了,毕竟还有其他事情等着完成。
用jquery发送ajax请求的确是太方便了,$.get、$.post、$.ajax等等,但我们有时候需要中途中止ajax请求。
举个例子,用comet做聊天时,发送一个请求后,服务端通常过几十秒后才会刷新链接、返回数据。假设服务端是30秒刷新一次链接,如果我们在10秒时想要停止这个ajax请求,怎么办呢?
先上代码,后面再解释
1
2
3
4
|
var ajaxGet = $.get(“comet_server.php”,{id:1}, function (data){ …. //一些操作 }); ajaxGet.abort(); |
上面这段代码其于两个知识点:
1. $.get返回的数据类型是XMLHttpRequest,请参考手册。($.post、$.ajax、$.getJSON、$.getScript也同样)
2. XMLHttpRequest对象有abort()方法
注意:abort()后,ajax请求立即停止,但还是会执行后面的function()。如果想避免执行其中的操作,可以在function()开始位置加判断
1
2
3
4
5
|
var ajaxGet = $.get(“comet_server.php”,{id:1}, function (data){ if (data.length == 0) return true ; …. //一些操作 }); ajaxGet.abort(); |
终止ajax请求:
1
2
3
4
5
|
var request = $.get(“ajax.aspx”,{id:1}, function (data){ //do something }); //终止请求动作. request.abort(); |
防止重复请求:
1
2
3
4
5
6
7
8
9
10
11
|
var request; if (request != null ) request.abort(); request = $.get(“ajax.aspx”,{id:1}, function (){ //do something }); ajax & setTimeout实现 secondTry 在等待一秒之后将firstTry的ajax终止: var firstTry = $.ajax( //do something ); var secondTry = setTimeout( function (){alert(‘ok');firstTry.abort()},1000); |
如何终止JQUERY的$.AJAX请求的更多相关文章
- 基于jquery,ajax请求及自我终止的函数封装。
场景描述: 在我们平时的开发过程中,经常会遇到这样的情况.在搜索功能中进行模糊搜索或者联想关联. 这就要我们每次对输入框中的数据进行改动时,都要发送一次请求.当在短时间内多次操作改动时,问题就出现了. ...
- 终止jQuery的$.ajax方法abort
最近遇到,如果用户频繁点击ajax请求,有两个问题: 1,如果连续点击了5个ajax请求,前4个其实是无效的,趁早结束节省资源. 2,更严重的问题是:最后一个发送的请求,响应未必是最后一个,有可能造成 ...
- jQuery发送ajax请求
利用jquery发送ajax请求的几个模板代码. $.ajax({ async : false, type: 'POST', dataType : "json", url: &qu ...
- JQuery发送ajax请求不能用数组作为参数
JQuery发送ajax请求不能用数组作为参数,否则会接收不到参数, 一.js代码如下: $('#delete-button').click(function(){ var select ...
- Angular和jQuery的ajax请求的差别
近期项目中使用angular,结果发现后台没法获取參数,所以,略微研究了一下两者在发送ajax时的差别. 注意angular和jquery的ajax请求是不同的. 在jquery中,官方文档解释con ...
- Jquery发送ajax请求以及datatype参数为text/JSON方式
Jquery发送ajax请求以及datatype参数为text/JSON方式 1.方式一:datatype:'text' 2.方式二:datatype:'JSON' 3.使用gson-1.5.jar包 ...
- 使用es6的then()方法封装jquery的ajax请求
使用场景: jsp页面中使用jquery的ajax请求比较频繁,以前vue框架的项目用过axios,所以就想着用then()封装一个公共请求的方法,这样每次请求就不用那么麻烦的写一大堆请求参数了. 示 ...
- jquery中ajax请求后台数据成功后既不执行success也不执行error解决方法
jquery中ajax请求后台数据成功后既不执行success也不执行error,此外系统报错:Uncaught SyntaxError: Unexpected identifier at Objec ...
- jQuery发送Ajax请求以及出现的问题
普通jQuery的Ajax请求代码如下: $.ajax({ type: 'POST', url: "http://xxx/yyy/zzz/sendVerifyCode", data ...
随机推荐
- C++ 模板特化以及Typelist的相关理解
近日,在学习的过程中第一次接触到了Typelist的相关内容,比如Loki库有一本Modern C++ design的一本书,大概JD搜了一波没有译本,英文版600多R,瞬间从价值上看到了这本书的价值 ...
- SQLite3 安装、基本操作
1. 安装SQLite3 sudo apt-get install sqlite3 2. 安装Sqlite3编译需要的工具包 如果,你需要的话可以安装该工具包.只是为了体验一把,可以不安装.该项是可选 ...
- 打开exls表格时报‘向程序发送命令是出现问题’的错误的解决方法
1.问题现象 打开表格文件时系统报如下错误 2.解决方法 1)按照如下方法找到excel选项,点击进入 2)找到‘忽略使用动态数据交换(DDE)的其它应用程序(O)',去掉复选框种的勾,点击确定,重新 ...
- 解决IDEA导入Myclipse项目的时候没有识别为Web项目的问题
IDEA在导入一个MyEclipse新建的Web项目的时候,一般会正确检测这个项目是什么项目.不过有时候会出现各种问题. 1. 出现一些Jar包不存在的问题,一般是servlet-api这样的包不存在 ...
- 删除/添加/调用WordPress用户个人资料的联系信息
如果你要折腾主题或者将WordPress站点开放注册,你可能需要自定义WordPress用户个人资料信息.下面倡萌将简单说一下如何删除.添加和调用自定义用户信息字段. 添加或删除字段,可以在主题的 f ...
- IEEEXtreme 10.0 - Game of Stones
这是 meelo 原创的 IEEEXtreme极限编程大赛题解 Xtreme 10.0 - Game of Stones 题目来源 第10届IEEE极限编程大赛 https://www.hackerr ...
- System.Net.Mail的应用,后端发送邮件
private void btn_send_Click(object sender, EventArgs e) { var emailAcount = ConfigurationManager.App ...
- loadrunner 分用户日志
loadrunner 分用户日志 loadrunner在run脚本时,模拟多用户并发场景下,通常需要分别关注每个用户的脚本执行日志,可以按照以下操作进行: 在“Run Load Tests”中选择需要 ...
- keycloak学习
keycloak 是一个针对Web应用和RESTfull Web API 提供SSO(Single Sign On:单点登陆),它是一个开源软件,源码地址是:https://github.com/ke ...
- 《互联网MySQL开发规范》
一.基础规范 使用 INNODB 存储引擎 表字符集使用 UTF8 所有表都需要添加注释 单表数据量建议控制在 5000W 以内 不在数据库中存储图⽚.文件等大数据 禁止在线上做数据库压力测试 禁⽌ ...