jQuery避免频繁的AJAX请求

最新推荐文章于 2021-08-05 15:40:52 发布

诚实的小猴子

最新推荐文章于 2021-08-05 15:40:52 发布

阅读量787

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript AJAX

本文链接：https://blog.youkuaiyun.com/luokuncool/article/details/25983055

JavaScript 同时被 2 个专栏收录

5 篇文章

订阅专栏

AJAX

3 篇文章

订阅专栏

本文介绍了一种防止因频繁触发事件导致AJAX请求过多而影响用户体验的方法。通过在请求开始时解除事件绑定，并在请求成功后重新绑定，有效避免了重复请求的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

之前在做网站的时候，有时候用到AJAX请求的时候发现，当给一元素绑定了某个事件，在这个事件被触发的时候就执行AJAX请求，但是如果没有及时等到服务器的响应，就回尝试频繁的触发那个事件，就得不到好的用户体验

$(function(){
  $('selector').bind('eventType', function(){
    $.ajax({
      type : 'POST',
      url : 'requestURL',
      dataType : 'json',
      success : function(res) {
        
      }
    });
  })
});

将代码进行以下修改就会更好：

$(function(){
  $('selector').bind('eventType', function(){
    var thisFunc = arguments.callee
      , self = $(this);
    self.unbind('eventType', thisFunc); //一次请求解绑事件监听函数
    //可以在这里加入显示进度条的代码
    $.ajax({
      type : 'POST',
      url : 'requestURL',
      dataType : 'json',
      success : function(res) {
        self.bind(thisFunc); //请求完成再次绑定事件监听函数
        //加入隐藏进度条的代码
      }
    });
  })
});