jQuery에 보류 중인 Ajax 요청이 있는지 어떻게 알 수 있습니까?

jQuery에 보류 중인 Ajax 요청이 있는지 어떻게 알 수 있습니까?

우리가 만든 jQuery 컨트롤에 문제가 있습니다.찾고 있는 항목의 ID를 입력할 수 있는 드롭다운 목록이 있다고 가정하고, 텍스트 상자에서 ENTER를 누르거나 포커스를 잃으면 입력한 ID가 올바른지 jQuery를 통해 확인되며, 그렇지 않으면 경고가 표시됩니다.

문제는 일반 사용자가 유효하지 않은 값을 입력한 후 Submit 버튼을 눌러 포커스를 잃으면 jQuery 투고는 폼 전송 후 반환된다는 것입니다.

양식 제출을 허용하지 않도록 jQuery에 의한 비동기 요청 처리가 있는지 확인할 수 있는 방법이 있습니까?

$.active활성 Ajax 요청 수를 반환합니다.

자세한 내용은 이쪽

ajaxStart 및 ajaxStop을 사용하여 요청이 활성 상태인 시기를 추적할 수 있습니다.

 $(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);
 });

$.ajax() 함수는 XMLHttpRequest 개체를 반환합니다.[ Submit ]버튼의 [OnClick]이벤트에서 접근할 수 있는 변수에 저장합니다.송신 클릭이 처리되면 XMLHttpRequest 변수가 다음 중 하나인지 확인합니다.

1) null(요구가 아직 전송되지 않았음을 의미함)

2) readyState 값이 4(Loaded)임을 나타냅니다.이는 요청이 성공적으로 전송 및 반환되었음을 의미합니다.

어느 경우든 true를 반환하고 제출을 계속합니다.그렇지 않으면 false를 반환하여 제출을 차단하고 사용자에게 제출이 작동하지 않은 이유를 알려줍니다.:)

요청이 활성화되면 $.ajax.abort() 메서드를 사용하여 요청을 중단해야 합니다.이 약속 개체는 readyState 속성을 사용하여 요청이 활성화되었는지 여부를 확인합니다.

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 () {

            }
        });

언급URL : https://stackoverflow.com/questions/1822913/how-do-i-know-if-jquery-has-an-ajax-request-pending