最近遇到,如果用户频繁点击ajax请求,有两个问题:
1,如果连续点击了5个ajax请求,前4个其实是无效的,趁早结束节省资源。

2,更严重的问题是:最后一个发送的请求,响应未必是最后一个,有可能造成混乱。还需要一个队列来维护发送的请求和响应。



我其实已经设计好了该队列的实现方式,后来发现jQuery直接通过abort方法,这样就不需要那么复杂的实现了,毕竟还有其他事情等着完成。







用jquery发送ajax请求的确是太方便了,$.get、$.post、$.ajax等等,但我们有时候需要中途中止ajax请求。

举个例子,用comet做聊天时,发送一个请求后,服务端通常过几十秒后才会刷新链接、返回数据。假设服务端是30秒刷新一次链接,如果我们在10秒时想要停止这个ajax请求,怎么办呢?

先上代码,后面再解释

1var ajaxGet = $.get("comet_server.php",{id:1},function(data){

2....//一些操作

3});

4ajaxGet.abort();

上面这段代码其于两个知识点:

1. $.get返回的数据类型是XMLHttpRequest,请参考手册。($.post、$.ajax、$.getJSON、$.getScript也同样)

2. XMLHttpRequest对象有abort()方法

注意:abort()后,ajax请求立即停止,但还是会执行后面的function()。如果想避免执行其中的操作,可以在function()开始位置加判断

view sourceprint?

1var ajaxGet = $.get("comet_server.php",{id:1},function(data){

2if(data.length == 0) return true;

3....//一些操作

4});

5ajaxGet.abort();







终止ajax请求:

var request = $.get("ajax.aspx",{id:1},function(data){

    //do something

});



//终止请求动作.

request.abort();





防止重复请求:

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方法abort的更多相关文章

  1. 重写jquery的ajax方法

    //首先备份下jquery的ajax方法 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中error和success ...

  2. jquery中$.ajax方法提交表单

    function postdata(){                        //提交数据函数 $.ajax({                                //调用jqu ...

  3. jquery通过ajax方法获取json数据不执行success

    1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准 ...

  4. jquery通过ajax方法获取json数据不执行success回调

    问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准写法,导致总是执行error回调方法 解决方案:使json格式务必符合下述 ...

  5. 关于Jquery中ajax方法data参数用法的总结

    data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...

  6. ajax系列之用jQuery的ajax方法向服务器发出get和post请求

    打算写个ajax系列的博文,主要是写给自己看,学习下ajax的相关知识和用法,以更好的在工作中使用ajax. 假设有个网站A,它有一个简单的输入用户名的页面,界面上有两个输入框,第一个输入框包含在一个 ...

  7. jQuery的$.ajax方法响应数据类型有哪几种?本质上原生ajax响应数据格式有哪几种,分别对应哪个属性?

    jQuery的$.ajax方法响应数据类型有:xml.html.script.json.jsonp.text 本质上原生ajax响应数据格式只有2种:xml和text,分别对应xhr.response ...

  8. jQuery中ajax方法无法执行回调函数问题

    最近遇到一个问题,发现使用jquery的ajax方法时,回调方法无法执行,而使用$.load()方法时却能正确返回数据.经过长时间调试最终发现是自己粗心大意,原来后台返回的是json数据,而返回的数据 ...

  9. 前端-jQuery的ajax方法

    https://www.cnblogs.com/majj/p/9134922.html 0.什么是ajax AJAX = 异步的javascript和XML(Asynchronous Javascri ...

随机推荐

  1. 继承(引用~析构~virtual)

    [1]程序1 #include <iostream> using namespace std; class Base { private: int m_nBase; public: Bas ...

  2. 为 Macbook 安装 wget 命令

    没想到装个这个命令那么麻烦, 还要装 xcode?..... 好吧,按步骤来成功装上 http://www.arefly.com/mac-wget/ 其實Mac也自帶了一個Curl同樣也可以下載網頁, ...

  3. lamp环境编译错误

    GD 编译出错解决方法 编译最新的2.0.35版本,用默认的 ./configure编译 当make的时候,出现以下错误 configure.ac:64: error: possibly undefi ...

  4. Android NDK 开发(三)--常见错误锦集合Log的使用【转】

    转载请注明出处:http://blog.csdn.net/allen315410/article/details/41826511  Android NDK开发经常因某些因素会出现一些意想不到的错误, ...

  5. JS实现复制网页内容自动加入版权内容代码和原文链接

    JS实现复制网页内容自动加入版权内容代码和原文链接 实现代码:在body内放入如下代码即可: <script type="text/javascript"> var S ...

  6. Thinkphp用exp表达式执行mysql语句,查询某字段不为空is not null,自动增值

    Thinkphp用exp表达式执行mysql语句,查询某字段不为空is not null,自动增值 Thinkphp 的文档经常不够完整的表达MYSQL的各种组合,is not null在thinkp ...

  7. The reference to entity “idNo” must end with the ';' delimiter 异常处理

    解决方案很简单,就是把配置项值中用到"&"的地方改成"&".原因是sax解析的类库在读取文件的时候是根据转义后的格式进行读取的,遇到" ...

  8. Facebook MyRocks at MariaDB

    Recently my colleague Rasmus Johansson announced that MariaDB is adding support for the Facebook MyR ...

  9. 文件名唯一(A.txt => An.txt)

    /// <summary> /// 文件名唯一(A.txt => An.txt) /// </summary> /// <param name="full ...

  10. Java JDBC 驱动 MySQL

    MySQL: 1>下载地址:http://www.mysql.com/products/connector/ 2> //jdbc:[数据库类型]://[ip地址]:[端口号]/[数据库名] ...