在做搜索功能时,文本框输入文本就得请求一次数据,如果上一次的请求还没回又请求了就导致数据错误和无用的数据请求。

我们需要输入文本时候判断上一次的ajax请求是否完毕,若还没完毕就终止本次请求。

对于jquery:

<script src = "jquery.js"></script>
<script>
var xhr = $.ajax({type:'POST',
url:'b.php',
data:'',
success:function(){
alert('ok');
}
})
alert(xhr); console.log(xhr);
</script>
<button id="song">abort</button>
<script>
$(function(){
$("#song").click(function(){
alert('click');
xhr.abort();
})
})
</script>

对于原生的js:

xmlHttp.open("POST","theUrl",true);
xmlHttp.onreadystatechange=function(){
...//得到响应之后的操作
}
xmlHttp.send();
//设置8秒钟后检查xmlHttp对象所发送的数据是否得到响应.
setTimeout("CheckRequest()","8000"); function CheckRequest(){
//为4时代表请求完成了
if(xmlHttp.readyState!=4){
alert('响应超时');
//关闭请求
xmlHttp.close();
}
}

终止ajax请求的更多相关文章

  1. ajax.abort 终止AJAX请求

                               $(document).ready(function () { var ajax; $('#choice').change(function() ...

  2. 如何终止JQUERY的$.AJAX请求

    最近遇到,如果用户频繁点击ajax请求,有两个问题: 1,如果连续点击了5个ajax请求,前4个其实是无效的,趁早结束节省资源. 2,更严重的问题是:最后一个发送的请求,响应未必是最后一个,有可能造成 ...

  3. ajax 请求被终止 chrome查询发现请求状态status为canceled

    检查页面的network执行中发现页面被刷新了url改变了导致请求在请求过程中被终止了. 检查代码发现在 submit方法中最后写了个  location.reload();方法 来重载页面 虽然是卸 ...

  4. 基于jquery,ajax请求及自我终止的函数封装。

    场景描述: 在我们平时的开发过程中,经常会遇到这样的情况.在搜索功能中进行模糊搜索或者联想关联. 这就要我们每次对输入框中的数据进行改动时,都要发送一次请求.当在短时间内多次操作改动时,问题就出现了. ...

  5. AJAX请求和跨域请求详解(原生JS、Jquery)

    一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...

  6. Ajax请求(二)--JQuery的Ajax请求方法

    JQuery库的Ajax请求的几种方法: 1. load( url, [data], [callback] ) :载入远程 HTML 文件代码并插入至 DOM 中. 参数含义: url (String ...

  7. jQuery实现Ajax请求时,页面显示等待的效果,超过指定请求时间后,进行其他操作

    背景:有一个按钮,点击之后向后端程序发起Ajax请求,在请求结果没有返回之前,页面显示等待的效果,此时仍旧是异步请求,等待的效果在接收到结果后撤销. 需求:因为网络延迟或者后端程序的问题,在发起Aja ...

  8. 一次ajax请求导致status为canceled的原因小记

    偶然碰到一个小Bug ajax请求执行后返回了一个canceled(状态码) 但是后台却接受了参数并且执行成功0.0 刚看到这个状态的时候是一脸懵逼的.... 之前并没见过这样的状态码 经过参数确认并 ...

  9. HTTP管线化技术--ajax请求

    1.管线化技术——客户端可以发送多次请求到服务端,而不需要等待上一次请求得到响应的时候才能进行下一次请求.实现并行发送请求 2.ajax——实现网页异步刷新 问题:当用户进行多次ajax请求的时候,并 ...

随机推荐

  1. 使用Pytesseract+Tesseract-OCR识别图片的简单步骤

    1.首先安装Pytesseract,这个很简单,直接输入命令 pip install pytesseract即可 2.Tesseract-OCR https://pan.baidu.com/s/1sV ...

  2. Aizu-1378- ICPC Asia 2017-Secret of Chocolate Poles

    Secret of Chocolate Poles Time Limit : 1 sec, Memory Limit : 262144 KB Problem A Secret of Chocolate ...

  3. (STM32F4) IAP程式碼實現

    IAP學習, 主要想了解實際上程式碼放在不同的Flash位置如何轉跳且執行. 我的應用程序只做了Pin12, Pin13 LED閃爍來分辨我的 App1 跟 App2的程式碼 App1 程式碼 int ...

  4. 863公司 linux软测题

    1.浏览目录命令 2.浏览文件命令 3.目录操作命令 4.文件操作命令 5.进程管理命令

  5. C语言编译器和IDE的选择

    什么是编译器: CPU只认识几百个二进制形式的指令,C语言对CPU而言简直就是天书.C语言是用固定的词汇与格式组织起来,简单直观,程序员容易识别和理解. 这时候就需要一个工具,将C语言代码转换成CPU ...

  6. C#集合之位数组

    如果需要处理的数字有许多位,就可以使用BitArray类和BitVector32结构.BitArray类位于System.Collection,BitVector32结构位于System.Collec ...

  7. stark - 2 ⇲路由分发

    在介绍前面三个注意点后,开始写stark组件内容. from django.apps import AppConfig from django.utils.module_loading import ...

  8. [短期持续更新]Codeforces 构造题一览

    说实话我觉得做这种题很没意思(不够硬核), 可是人有短板终究是要补的...起码这种类型补起来相对简单 所以还是把先前准备好的专题放下吧,做点实现上比较休闲的题 ps.为了精简篇幅,代码全部丢到ubun ...

  9. dubbo核心流程一览

    整体设计 图中从下至上分为十层,各层均为单向依赖,右边的黑色箭头代表层之间的依赖关系,每一层都可以剥离上层被复用,其中,Service 和 Config 层为 API,其它各层均为 SPI. Serv ...

  10. android面试注意点

    Java 基础知识 面向对象的基本思想 Object类相关:Object类的几个关键函数.String涉及到的常量池概念,序列化 & 反序列化. 重要关键字:final.static. 内部类 ...