jQueryに保留中のAjaxリクエストがあるかどうかを知るにはどうすればよいですか？

Question

私が作ったjQueryコントロールにいくつか問題があります。探している項目のIDを入力できるドロップダウンリストがあるとし、Enterキーを押すかテキストボックスでフォーカスを失うと、jQueryを使って入力したIDが正しいかどうかを確認し、正しくない場合は警告を表示します't。

一般的なユーザーが無効な値を入力し、送信ボタンを押してフォーカスを失った場合、フォームの送信が送信された後、jQueryポストが返されます。

フォームの送信を許可しないように、非同期リクエスト処理がjQueryで処理されているかどうかを確認する方法はありますか？

Answer 1

ajaxStartとajaxStopを使用して、いつリクエストがアクティブであるかを把握できます。

Answer 2

$ .ajax（）関数は、XMLHttpRequestオブジェクトを返します。送信ボタンの "OnClick"イベントからアクセス可能な変数に格納します。 ）

1ヌル、何の要求はreadyStateの値が（ロード）4であることをまだ

2）送信されていないことを意味：場合は、[送信]をクリックしますは、XMLHttpRequestの変数があるかどうかを確認するためにチェックを処理しています。これは、要求が送信され、正常に返されたことを意味します。

いずれの場合も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() { 

      } 
     });