jQuery ajaxStop()方法

  • Post category:jquery

jQuery中的ajaxStop()方法用于在所有Ajax请求完成后运行函数。当没有未完成的Ajax请求时,ajaxStop()会被调用。

语法

$(document).ajaxStop(function);

参数

  • function:必需。规定当每个ajax请求均已完成时要运行的函数。

示例1

$(document).ajaxStop(function() {
   $("#loading").hide(); // 隐藏loading提示框
});

上述示例在所有 Ajax 请求完成后隐藏了一个 id 为 “loading” 的元素。

示例2

jQuery也可以控制 AJAX 请求的完成时间。下面的示例在请求完成前显示一个 ‘loading’ 图片。当请求完成后,’loading’ 图片被隐藏。

//显示 loading 图片
$("#loading").ajaxStart(function() {
    $(this).show();
});

//隐藏 loading 图片
$("#loading").ajaxStop(function() {
   $(this).hide();
});

// 发送 AJAX 请求
$.ajax({
  url: '/test',
  type: 'POST',
  data: {
    name: 'test'
  },
  success: function(data) {
    console.log('请求成功');
  },
  error: function() {
    console.log('请求失败');
  }
});

上述示例中会在 Ajax 请求发起前显示一个 id 为 “loading” 的元素,并在请求完成后隐藏它。 在请求完成后,ajaxStop()方法被调用,从而隐藏 “loading” 元素。

需要注意的是,ajaxStop()方法必须绑定在 document 对象上。