如何防止ajax请求？

Question

我有以下情况：页面显示一组项目，当用户点击项目时，通过ajax请求加载项目详细信息。我想要做的是防止进一步点击的Ajax请求，因为信息已经加载。

我使用jQuery和Rails 3和我的代码看起来是这样的：

# view 
- @items.each do |item| 
    .item 
    = link_to item.name, item_path(item), :remote => true 

// js 
$(function(){ 
    $('.item').bind('ajax:success', function(xhr, data, status){ 
    ... 
    }); 

    $('.item').bind('ajax:before', function(xhr){ 
    if (...) { // check if data already loaded 
     // ??? 
    } 
    }); 
}); 

我是一个正确的方式？或者有另一种解决方案？

Answer 1

原来我用错了回调的成功完成。正确的回调是ajax:beforeSend，并带有以下签名function(event, xhr, settings)。为了防止发送请求，我使用了xhr.abort()，它工作正常。

http://www.alfajango.com/blog/rails-3-remote-links-and-forms/

Answer 2

你可以在ajax调用之前设置一个像itemsLoaded = false这样的标志。详细信息加载的那一刻，您可以将该标志设置为itemsLoaded = true。阿贾克斯调用只应执行时if(!itemsLoaded){/* Do ajax to fetch details */}else return;

Answer 3

我认为你唯一能做的就是确保项目中的点击只能进入ajax函数一次。方法可以做到这一点：

• click事件调用禁用的项目

• 如果你想确保的绑定功能，你做了ajax成功函数相同

• 单击该项目后，您的功能将检查项目信息是否已经存在。如果是，那么它只是返回。

Answer 4

一种解决方案是，你可以创建一个布尔值，则只会使Ajax调用如果该值为false。

Answer 5

设置在阿贾克斯的变量：成功的功能是这样的...

AjaxSuccessVar=0; 
$(function(){ 
    $('.item').bind('ajax:success', function(xhr, data, status){ 
     AjaxSuccessVar = 1; 
}); 

$('.item').bind('ajax:before', function(xhr){ 
    if (AjaxSuccessVar==0) { // check if data already loaded 
     //then do your ajax function here 
    } 
}); 

Answer 6

如何使用.data属性作为一个指标，如：

$('.item').bind('ajax:success', function(xhr, data, status){ 
     $(this).data("loaded", true); 

    }).bind('ajax:before', function(xhr){ 
     if (!$(this).data("loaded")) { 
      // data has not been loaded 
     } else { 
      // do something 
     } 
    }); 

编辑：

尝试从项目“触发器”点击后解除绑定，例如：

$(".item").click(function() { 
    $.ajax({ ... }); 
    $(this).unbind("click"); 
}); 

或者是请求ajax:success

$('.item').bind('ajax:success', function(xhr, data, status){ 
     $(this).unbind("click"); 
    });