Question

在一个页面中，我有多个图像。我将展示一个div容器进行预览。在这里，在加载图像之前，我将向我的服务器发送请求以获取图像转换详细信息。一旦它成功，我将展示图像预览。当用户单击下一个/上一个图标时，我将加载相应的图像。但是，如果用户不断点击下一个/上一个图标，Ajax请求将一遍又一遍地发送。这里，如果Ajax请求中有任何延迟。预览中未显示正确的图像。例如：如果用户不断点击，Ajax请求与5.jpg相关的数据。但是，在预览中它显示4.jpg图像。怎么处理这个。

Answer 1

这样做：

每次点击按钮时，都会将request存储在变量中。

var request = $.ajax({
    url: 'your url',
    success: function(data){
    }
 });

现在，当用户再次点击该按钮时，在click处理程序中，中止旧的request。

request.abort();

类似的东西：

var request = null;
$('.button').click(function(){
     if(request){
        request.abort();
     }

     request = $.ajax({
        url: 'your url',
        data: 'which image to load',
        success: function(data){
        }
     });
});

处理Ajax请求

1 个答案: