Как узнать, ожидает ли jQuery запроса Ajax?

Question

У меня возникли проблемы с элементом управления jQuery, который мы создали. Предположим, у вас есть раскрывающийся список, который позволяет вам вводить идентификатор элемента, который вы ищете, и когда вы нажимаете ENTER или теряете фокус в текстовом поле, он проверяет через jQuery, что введенный вами идентификатор верен, показывая предупреждение, если оно «т.

Дело в том, что когда обычный пользователь вводит в него недопустимое значение и теряет фокус, нажимая кнопку отправки, столбец jQuery возвращается после отправки отправки формы.

Есть ли способ проверить, есть ли какая-либо обработка запроса async с помощью jQuery, чтобы я не разрешил отправку формы?

Answer 1

Вы можете использовать ajaxStart и ajaxStop, чтобы отслеживать, когда запросы активны.

Answer 2

Функция $ .ajax() возвращает объект XMLHttpRequest. Сохраните это в переменной, доступной из события «OnClick» кнопки «Отправить». При отправке нажмите перерабатывается проверить, если переменная является XMLHttpRequest:

1) нулевой, а это означает, что ни один запрос не был отправлен еще

2), что значение readyState составляет 4 (Loaded). Это означает, что запрос был отправлен и успешно возвращен.

В любом из этих случаев верните true и разрешите отправке продолжить. В противном случае верните false, чтобы заблокировать отправку и дать пользователю некоторое указание на то, почему их передача не работала. :)

Answer 3

$.active возвращает количество активных запросов Ajax.

Подробнее here

Answer 4

$(function() { 
     function checkPendingRequest() { 
      if ($.active > 0) { 
       window.setTimeout(checkPendingRequest, 1000); 
       //Mostrar peticiones pendientes ejemplo: $("#control").val("Peticiones pendientes" + $.active); 
      } 
      else { 

       alert("No hay peticiones pendientes"); 

      } 
     }; 

     window.setTimeout(checkPendingRequest, 1000); 
}); 

Answer 5

Этот метод использует скрипку $ .ajax.abort(), чтобы отменить запрос, если он активен. Он использует свойство readyState, чтобы проверить, активен запрос или нет.

Это Working Fiddle

HTML

<h3>Cancel Ajax Request on Demand</h3> 
<div id="test"></div> 
<input type="button" id="btnCancel" value="Click to Cancel the Ajax Request" /> 

JS код

//Initial Message 
var ajaxRequestVariable; 
$("#test").html("Please wait while request is being processed.."); 

//Event handler for Cancel Button 
$("#btnCancel").on("click", function(){ 
if (ajaxRequestVariable !== undefined) 

if (ajaxRequestVariable.readyState > 0 && ajaxRequestVariable.readyState < 4) 
{ 
    ajaxRequestVariable.abort(); 
    $("#test").html("Ajax Request Cancelled."); 
} 
}); 

//Ajax Process Starts 
ajaxRequestVariable = $.ajax({ 
      method: "POST", 
      url: '/echo/json/', 
      contentType: "application/json", 
      cache: false, 
      dataType: "json", 
      data: { 
     json: JSON.encode({ 
     data: 
      [ 
          {"prop1":"prop1Value"}, 
        {"prop1":"prop2Value"} 
        ]   
     }), 
     delay: 11 
    }, 

      success: function (response) { 
      $("#test").show(); 
      $("#test").html("Request is completed");   
      }, 
      error: function (error) { 

      }, 
      complete: function() { 

      } 
     });