2016-11-09 3 views
1

Я выполняю асинхронный запрос на загрузку json-файла с использованием XMLHttpRequest(). Мне нужно будет дождаться завершения запроса, прежде чем продолжить с остальными.Как использовать ajaxComplete, примененный к XMLHttpRequest

Я видел, что ajaxComplete() должен делать именно это, но я не могу применить его к своему фактическому коду и заставить его работать.

Здесь я настройка функции, которая вызывает JSON с помощью асинхронного запроса

function ajaxCall(){ 

    xmlhttp.onreadystatechange = function(){ 

     if(xmlhttp.readyState==4 && xmlhttp.status==200){ 
      arrayImages = JSON.parse(xmlhttp.responseText); 
      output(arrayImages); 
     } 
    } 

    xmlhttp.open("GET", url, true); 
    xmlhttp.send(); 

} 

Здесь я звоню эту функцию

ajaxCall(); 

Теперь я хочу, чтобы он завершил

do other things 

Любая помощь?

Спасибо!

+2

Сделайте 'ajaxCall' признанным обратным вызовом, который« выполняет другие действия ». См. [Как вернуть ответ от асинхронного вызова?] (Http://stackoverflow.com/q/14220321/218196) для конкретных примеров. –

+0

* «Я видел, что ajaxComplete() должен делать именно это» * Кажется, это вещь jQuery. Поскольку вы не используете jQuery, это не относится к вам. –

ответ

1

У вас есть два варианта.

Promise

function ajaxCall(){ 
    return new Promise(function(success){ 
     xmlhttp.onreadystatechange = function(){ 
      if(xmlhttp.readyState==4 && xmlhttp.status==200){ 
       arrayImages = JSON.parse(xmlhttp.responseText); 
       output(arrayImages); 
       success(); 
      } 
     } 
     xmlhttp.open("GET", url, true); 
     xmlhttp.send(); 
    }); 
} 

Тогда вы можете делать такие вещи, когда это сделано

ajaxCall().then(function(){ 
    // Do stuff after 
}); 

Или вы можете использовать обратный вызов ...

function ajaxCall(callback){ 
    xmlhttp.onreadystatechange = function(){ 
     if(xmlhttp.readyState==4 && xmlhttp.status==200){ 
      arrayImages = JSON.parse(xmlhttp.responseText); 
      output(arrayImages); 
      callback(); 
     } 
    } 
    xmlhttp.open("GET", url, true); 
    xmlhttp.send(); 
} 

Затем сделать вещи после

ajaxCall(function(){ 
    // do stuff after 
}); 
+0

Спасибо за помощь, Я пробовал все из них, в частности, второй, но он не хочет идти в функцию. Таким образом, он запускает ajaxCall(), но он не запускает код внутри ... ajaxCall (function() { alert ('Hello!'); }); – rolfo85

+0

@ rolfo85 - Вы добавили параметр обратного вызова в функцию?Вы вызвали параметр callback в функции? есть два места, которые необходимо добавить. опубликуйте обновленный код. –

1

ajaxComplete является частью библиотеки jQuery. Он связывается только с jQuery ajax-запросами. Хотя они обычно завершают XMLHttpRequest, они не могут касаться XMLHttpRequest, когда вы используете его вручную.

Чтобы запустить код после ответа, вам нужно подождать подходящего события. Вы уже делаете, что здесь:

if(xmlhttp.readyState==4 && xmlhttp.status==200){ 

Поместите код, который вы хотите запустить после того, как будет получен ответ в том, что если заявление.

Если вы хотите сделать повторно ajaxCall, то передайте ему функцию в качестве аргумента, а затем вызовите эту функцию внутри оператора if.

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