Rails UJS：当触发一个新的Ajax请求时放弃以前触发但仍然活动的Ajax请求

Question

我有一个Ruby on Rails 4.2应用程序。

我有3个按钮，触发AJAX请求使用Rails UJS

<section id="buttons"> 
    <%= link_to image_tag(image), 
     button1_modal_path, 
     remote: true, 
     id:"icon1", 
     data: { disable_with: '' } %> 
    <%= link_to image_tag(image), 
     button2_modal_path, 
     remote: true, 
     id:"icon2", 
     data: { disable_with: '' } %> 
    <%= link_to image_tag(image), 
     button3_modal_path, 
     remote: true, 
     id:"icon3", 
     data: { disable_with: '' } %> 
</section> 

我希望实现以下模式：

• 用户点击按钮1推出AJX XHR请求（让（我们称它为ajaxRequest1）

• ajax仍在处理中（以及它所处的状态：已发送，已经由服务器处理过，在它回来之前......），但没有t到达（200）和用户点击按钮2触发另一个xhr ajax请求（ajaxRequest2）

• 我想在这种情况下，所有其他活动的ajax请求（也就是说在这种情况下ajaxRequest1）被取消。如果有比只多了一个请求的更多，这将取消所有这些除了最后一个Ajax请求（即ajaxRequest2）

我想这使用Rails UJS ajax events，但它不工作（实际上取消所有Ajax请求被触发:(：

on('ajax:beforeSend',function(event, xhr, settings){ 
    xhr.onreadystatechange = null; 
    xhr.abort(); 
} 

注：我想，我不只是取消浏览器正在等待Ajax请求返回的事实，并显示其内容，但也是如果在最好的情况下请求已经启动，但尚未命中服务器，它在被服务器命中之前被取消，以免超出用无用的阿贾克斯请求加入服务器。

Answer 1

要取消请求1，你应该调用根据请求1中止XMLHttpRequest对象上，例如

ajaxRequest1.abort(); 

你的代码的含义是在发送之前中止的请求。

on('ajax:beforeSend',function(event, xhr, settings){ 
    xhr.onreadystatechange = null; 
    xhr.abort(); 
}