主要调用jquery提供的ajax abort方法，详细代码如下：

 <html>

 <head>

 <meta charset="UTF-8">

 <script src="http://apps.bdimg.com/libs/jquery/1.7.2/jquery.min.js"></script>

 <script type="text/javascript">

 var ajax = null;

 function startAjax() {

   //方法就是将XHR对象指向ajax，再调用ajax的.abort()来中止请求

   ajax = $.ajax({

     type: 'POST',

     url: 'test.php',

     data: {

       username: "test"

     },

     dataType: 'JSON',

     error: function() {

       console.log('error');

     },

     success: function(data) {

       console.log(data);

     }

   });

 }

 function stopAjax(){

     //如若上一次AJAX请求未完成，则中止请求

     ajax&&ajax.abort();

 }

 </script>

 </head>

 <body>

 <input type="button" value="触发请求" onclick="startAjax()" />

 <input type="button" value="停止请求" onclick="stopAjax()" />

 </body>

 </html>

test.php

 <?php

 // 休眠6秒之后在进行后续流程，方便测试停止事件

 sleep(6);

 echo '{"username": "'.$_POST['username'].'"}';

 ?>

手动停止jquery ajax请求的更多相关文章

  1. jquery ajax请求方式与提示用户正在处理请稍等，等待数据返回时loading的显示

    1.jquery ajax请求方式与提示用户正在处理请稍等 为了提高用户体验度,我们通常会给出 “正在处理,请稍等!”诸如此类的提示.我们可通过设置$.ajax()下的参数beforeSend()来实 ...

  2. jQuery ajax 请求php遍历json数组到table中

    html代码(test.html),js在html底部 <!DOCTYPE html> <html lang="en"> <head> < ...

  3. jquery Ajax请求示例，jquery Ajax基本请求方法示例

    jquery Ajax请求示例,jquery Ajax基本请求方法示例 ================================ ©Copyright 蕃薯耀 2018年5月7日 https: ...

  4. jquery.ajax请求aspx和ashx的异同 Jquery Ajax调用aspx页面方法

    1.jquery.ajax请求aspx 请求aspx的静态方法要注意一下问题: (1)aspx的后台方法必须静态,而且添加webmethod特性 (2)在ajax方法中contentType必须是“a ...

  5. 原生js，jquery ajax请求以及jsonp的调用

    ajax    是用来处理前后端交互的技术,可以改善用户体验,其本质是    XMLHttpRequest,异步访问服务器并发送请求数据,服务器返回响应的数据,以页面无刷新的效果改变页面中的局部内容  ...

  6. jQuery ajax请求错误返回status 0和错误error的问题

    上周发现一个jQuery ajax请求错误返回status 0和错误error的问题,responseText是"error",状态码是0而不是200: $.ajax({ type ...

  7. jquery Ajax请求中显示Loading...

    jquery Ajax请求中显示Loading... $('#btnTest').click(function(){      $.ajax({           url ---- ,根据你需要设置 ...

  8. 二、jQuery Ajax请求

    一.Ajax请求 1.jQuery Ajax请求 let ajaxTimeOut = $.ajax({ //将网络请求事件赋值给变量ajaxTimeOut url: "/api_v1.1/a ...

  9. jquery ajax请求成功，数据返回成功，seccess不执行的问题

    1.状态码返回200--表明服务器正常响应了客户端的请求:       2.通过firebug和IE的httpWatcher可以看出服务器端返回了正常的数据,并且是符合业务逻辑的数据.         ...

随机推荐

  1. idea中的调试按键（f5,f6,f7,f8,f9）

    f5: 如果断点处存在方法,f5 则强制进入方法内部,然后一步一步执行方法体, 如果再遇到方法,则继续进入方法体,如此循环,直到执行到断点开始处: f6: 从断点处一步步执行以后的代码,会跳出断点所在 ...

  2. C# vb .net实现焦距柔化特效滤镜

    在.net中,如何简单快捷地实现Photoshop滤镜组中的焦距柔化效果呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 第 ...

  3. SpringBoot的入门程序

    1. 创建一个springboot工程 可以参考springboot入门程序 2. 创建一个实体类 @Data //想相当于@Setter.@Getter和@ToString替代了setter.get ...

  4. Ajax实现异步请求

    基本步骤:创建XMLHttpRequest对象-->配置发送参数-->执行发送-->处理响应 ajax 通俗讲有四个步骤 1.创建Ajax对象2.链接到服务器3.发送请求4.接受返回 ...

  5. node连接Mysql报错ER_NOT_SUPPORTED_AUTH_MODE

    报错信息 本人系统安装的是mysql-installer-community-8.0.18.0.msi这个版本,然后我本地使用node-mysql去连接数据库. test.js文件 var mysql ...

  6. Synchronized可重入锁分析

    可重入锁又称递归锁,是指在同一个线程在外层方法获取锁的时候,再进入该线程的内层方法会自动获取锁(前提是锁对象必须是同一对象或者class), 不会因为之前已经获取过还没实方而发生阻塞.即同一线程可执行 ...

  7. WPF应用打包流程

    1,安装工程模板插件Microsoft Visual Studio Installer Projects https://marketplace.visualstudio.com/items?item ...

  8. Linux添加硬盘创建新的逻辑卷方式

    有同仁看了上文<Linux添加硬盘扩充已有分区存储空间方式>一文后,提出疑问,现在很多云服务器本来没有逻辑卷,添加数据盘后需要自行添加,如何处理? 此文将以某云服务器为例,详细进行解说. ...

  9. 【函数】wm_concat包的订制

     [函数]wm_concat包的订制   1  BLOG文档结构图     2  前言部分   2.1  导读和注意事项 各位技术爱好者,看完本文后,你可以掌握如下的技能,也可以学到一些其它你所不知道 ...

  10. appium自动化webview时遇到的chromedriver问题

    安卓app里面的网页,基本上都是使用手机系统上的webview 去显示的. 安卓 webview 可以看成是 手机上的 chrome 浏览器精简版. appium desktop 里面内置了 用于 w ...