Ajax取消请求（放弃监听旧请求，发起新请求）

最新推荐文章于 2024-10-15 16:22:01 发布

docuxu

最新推荐文章于 2024-10-15 16:22:01 发布

阅读量697

点赞数

分类专栏： frontend 文章标签： ajax

本文链接：https://blog.csdn.net/docuxu/article/details/109399270

版权

frontend 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

本文探讨了在Web后台项目中如何通过使用jQuery的$.ajax方法，避免因连续输入导致的多次请求并发问题，确保查询的稳定性和准确性。通过定义全局变量管理AJAX请求，解决了查询结果渲染不一致的问题。

摘要由CSDN通过智能技术生成

近期的一个web后台项目有一个input输入框内容改变出发查询的事件，但是大领导要求的是全表模糊查询，查询时间过长引发了问题。code完成后发现连续输入字符后，发起多个请求，先发的请求可能后收到响应从而渲染，导致查询的文本和查询结果不匹配。经过一番资料查询，使用如下方法解决。

jquery方式：

// 定义一个全局变量
var xhr=null；
// 每次处理前判断变量性质
if(xhr){
    // 如果请求未到达服务端会取消请求
    // 如果请求到达服务端不会取消请求 只会放弃对请求的监听
    xhr.abort();
}
// 将ajax的jquery对象赋值给全局变量
xhr = $.ajax({
    url:
    type:
    data:
    success:function(res){

    }
})