2016-05-03 3 views
-1

Как я могу отменить/прервать/остановить все запросы/запросы AJAX, которые еще не получили ответ с кнопкой или событием клика? Потому что я делаю несколько вызовов AJAX. Вот мой код:jQuery отменяет все запросы AJAX (запрос) по нажатию кнопки

function makeCalls() { 
    var urls = ["url1.php", "url2.php", "url3.php", "url4.php"]; 
    $.each(urls, function(index, value) { 
     $.ajax({ 
      global: false, 
      type: 'POST', 
      url: value, 
      dataType: 'html', 
      data: returnData(), 
      cache: false, 
      timeout: 60000, 
      success: function(result) {   
       switch(value) { 
        case "url1.php": 
         // my code for url1 
        case "url2.php": 
         // my code for url2 
        case "url3.php": 
         // my code for url3 
        case "url4.php": 
         // my code for url4 
       } 
      }, 
      error: function (request, status, error) { 
       console.log('ERROR: ' + request.responseText); 
      } 
     }); 
    }); 
} 
+0

возможно дубликат http://stackoverflow.com/questions/4551175/how-to-cancel- abort-jquery-ajax-request –

+0

@Mike Этот запрос AJAX является функцией, я хочу иметь некоторую кнопку, когда я нажал на все AJAX, чтобы остановиться. Я прочитал все сообщения из stackoverflow .... – diank

+0

вы можете просто сохранить глобальный массив для всех запросов, например. ajaxRequestsArray = []; Затем, когда вы делаете запрос ajax, нажмите его ссылку в этом массиве. Нажав на нужную кнопку, прокрутите этот массив и прервите каждый запрос один за другим. –

ответ

2
var ajaxRequestsArray = []; 

function makeCalls() { 
    var urls = ["url1.php", "url2.php", "url3.php", "url4.php"]; 
    $.each(urls, function(index, value) { 
    var ajaxRequest = $.ajax({ 
      global: false, 
      type: 'POST', 
      url: value, 
      dataType: 'html', 
      data: returnData(), 
      cache: false, 
      timeout: 60000, 
      success: function(result) {   
       switch(value) { 
        case "url1.php": 
         // my code for url1 
        case "url2.php": 
         // my code for url2 
        case "url3.php": 
         // my code for url3 
        case "url4.php": 
         // my code for url4 
       } 
      }, 
      error: function (request, status, error) { 
       console.log('ERROR: ' + request.responseText); 
      } 
     }); 
     ajaxRequestsArray.push(ajaxRequest); 
    }); 
}//makeCalls() 

Теперь предположим, что это ваша кнопка:

<a href="#" id="abort-all-ajax" title="Abort all requests">Abort all requests</a> 

$("#abort-all-ajax").on("click", function(e){ 
    e.preventDefault(); 
    for(var i = 0; i < ajaxRequestsArray.length; i++) 
    { 
     var curRequest = ajaxRequestsArray[i]; 
     curRequest.abort(); 
    }//for() 

});//click handler 
+0

он говорит: «ajaxRequest не определен» в «ajaxRequestsArray.push (ajaxRequest);» – diank

+1

"ajaxRequest не определен" или "ajaxRequest не определен"? Убедитесь, что вы не нажимаете ajaxRequests, а ajaxRequest. –

+0

вы также можете обратиться к этому JSFiddle http://jsfiddle.net/s4pbn/3/. Это не мой код, но дает тот же результат. –

Смежные вопросы