jQuery实现ajax的叠加和停止(终止ajax请求)

jQuery实现ajax的叠加和停止的关键代码如下所示：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>jQuery中终止Ajax请求</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script>
  <script>
    var arrayAJAX = new Array();
    $(function () {
      $("#btn").bind("click", function () {
        for (var i = 0; i < 100; i++) {
          starAJAX(i);
        }
      });
      $("#bt2").bind("click", function () {
        stopAJAX();
        alert("终止AJAX请求");
      });
    })
    //停止ajax
    function stopAJAX() {
      for (var i = 0; i < arrayAJAX.length; i++) {
        arrayAJAX[i].abort();
      }
      arrayAJAX = new Array();
    }
    //添加ajax
    function starAJAX(i) {
      var options = {
        url: '/Home/addallrecommandbook',
        data: "html=" + i,
        success: function (data, textStatus) {
          if (textStatus == 'success') {
            alert("添加成功！");
          }
          else {
          }
        },
        error: function (x, msg, err) {
        }
      };
      arrayAJAX.push($.ajax(options));
    }
  </script>
</head>
<body>
  <input type="button" id="btn" value="starAJAX" />
  <input type="button" id="bt2" value="stopAjax" />
</body>
</html>

以上所述是小编给大家介绍的jQuery实现ajax的叠加和停止(终止ajax请求)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • JQUERY的AJAX请求缓存里的数据问题处理

    参数type由get改成post 添加参数cache并设置成false 添加时间戳 $.ajax({ url: 'ios/index', cache: false, type: 'post', data: { timestamp: new Date().getTime() //params here }, dataType: 'json' }).done(function (data) { //codes here }); 是不是非常的简单呢,希望小伙伴们能够喜欢.

  • jQuery实现监控页面所有ajax请求的方法

    本文实例讲述了jQuery实现监控页面所有ajax请求的方法.分享给大家供大家参考,具体如下: 你是不是有遇到这样的问题:页面发起两个ajax请求,希望它们都成功以后,再做一个动作? 很容易想到的解决方案是,等其中一个结束以后,再发起另外一个,这个过程用回调函数来完成. 但是,如果其中一个ajax请求的代码不是你写,你改不了,怎么办? 又或者说,你只想知道某个url请求什么时候结束,不想管其他的请求,怎么弄? <!DOCTYPE html> <html lang="en&quo

  • 使用jQuery处理AJAX请求的基础学习教程

    $.ajax快捷方法 $.get(url,[data],[callback],[type]) $.post(url,[data],[callback],[type]) 两种方法请求方式不同,其他方式相同. 参数:url[请求地址],data[请求的数据内容(obj对象)],callback[回调函数(只能处理请求成功事件)], type[请求返回数据的编码格式(默认ContentType指定格式)] $.get('/test?x=1'); $.get('/test',{z:2}); $.post

  • 基于JQuery的$.ajax方法进行异步请求导致页面闪烁的解决办法

    基于JQuery的$.ajax方法进行异步请求导致页面闪烁的解决办法

    情景 目前有个需求是在文本框填入内容,自动触发keyup事件,下拉列表会自动过滤相应的选项,但是使用了$,ajax后发现,每次触发事件时,都导致整个网页闪烁,触发了全局ajax事件 代码片段 $.ajax({ type: "POST", url: root + "/xxx, data: requestData, dataType: "json", success: function(data){ // 清空列表 $("#formOpinion #

  • 实例详解jQuery Mockjax 插件模拟 Ajax 请求

    1. 原理 jquery-mockjax是用于mock 前台ajax向后台请求的返回数据. 原理很简单 在你js代码要发送ajax请求的地方断点一下,然后比较在[引入jquery-mockjax] 和 [没有引入jquery-mockjax]的情况下$.ajax.toString()的值情况. 很明显,引入jquery-mockjax时,这个mock库会对jquery提供的ajax函数做替换.这样就很容易能mock起来. 在实际的开发过程中,前端后台协商好了统一的接口,就各自开始自己的任务了.这

  • 教你如何终止JQUERY的$.AJAX请求

    最近遇到,如果用户频繁点击ajax请求,有两个问题: 1,如果连续点击了5个ajax请求,前4个其实是无效的,趁早结束节省资源. 2,更严重的问题是:最后一个发送的请求,响应未必是最后一个,有可能造成混乱.还需要一个队列来维护发送的请求和响应. 我其实已经设计好了该队列的实现方式,后来发现jQuery直接通过abort方法,这样就不需要那么复杂的实现了,毕竟还有其他事情等着完成. 用jquery发送ajax请求的确是太方便了,$.get.$.post.$.ajax等等,但我们有时候需要中途中止a

  • jQuery ajax请求返回list数据动态生成input标签,并把list数据赋值到input标签

    废话不多说了,直接给大家贴代码了,具体内容如下所示: // js <script type="text/javascript"> function myBtn_f() { var cnt = $('#myCnt').val(); syncAjax('myAjax.html', { 'cnt' : cnt }, function(result) { if (100 == result.statusCode) { var data = result.lst; var $d =

  • 浅析jQuery Ajax请求参数和返回数据的处理

    浅析jQuery Ajax请求参数和返回数据的处理

    刚接触学会用jQuery ajax的时候,觉得真东西好神奇,这样就可以把数据取回来了啊.然后我可以把取回来的数据渲染到页面上,一颗赛艇. 之前很早接触到项目,并不知道怎么优雅的去用jquery ajax(现在也不优雅): 那个时候看别人写的代码 有 $.post("","",...) 也有 $.get("","",...) 还有 $.ajax() 当然现在知道点,这些写法都是一个意思,还是习惯用 $.ajax() 写写吧. 之

  • 当jquery ajax遇上401请求的解决方法

    jquery ajax是个很常用接口,而在请求时候,可能存在响应401的情况(身份认证过期或未登录),比较容易出现在混合应用上,如何进行身份认证,重发失败请求,还是值得注意的. ajax请求有两种方式 1. 回调 最常写的方式,成功失败处理以回调方式传入. $.ajax({ ajax参数... success : xxxxxx error: xxxxxx }); 2. Deferred方式 Deferred模式我在<js异步编程>有说明, ajax调用本身返回就是一个Deferred对象,成功

  • js与jQuery终止正在发送的ajax请求的方法

    本文实例讲述了js与jQuery终止正在发送的ajax请求的方法.分享给大家供大家参考,具体如下: 核心:调用XMLHttpRequest对象上的abort方法 jquery的ajax方法有自己的超时时间设置参数: $.ajax({type:'POST', url:'b.php', data:'', timeout:5000, success:function(){ } }) 同时 1. $.get返回的数据类型是XMLHttpRequest,请参考手册.($.post.$.ajax.$.get

随机推荐