2013-08-19 3 views
2

Я пытаюсь создать сценарий, который позволяет мне сделать ajax-вызов с несколькими строками кода. Скрипт работает с одним ajax-запросом, но когда дело доходит до обработки сразу нескольких запросов, это терпит неудачу. Что я сделал не так ?Завершено только последнее из нескольких запросов ajax.

Код обрабатывает только последний запрос, оставив остальные «Загрузка ...».

Вот мой код:

/**************** 
    Related Javascript inside the HTML document 
****************/ 
// First request 
var ajax1 = new ajax_class(); 
ajax1.meth = "GET"; 
ajax1.file = "ajax_info.txt"; 
ajax1.elem = "results"; 
ajax1.send = null; 
ajax1.ajax_call(ajax1.meth, ajax1.file, ajax1.elem, ajax1.send); 

... 

// Third request 
var ajax3 = new ajax_class(); 
ajax3.meth = "GET"; 
ajax3.file = "ajax_info3.txt"; 
ajax3.elem = "results3"; 
ajax3.send = null; 
ajax3.ajax_call(ajax3.meth, ajax3.file, ajax3.elem, ajax3.send); 

/**************** 
    Related HTML inside the HTML document 
****************/ 

<body> 
<div id="results">Nothing has happend yet for 1....</div> 
<div id="results2">Nothing has happend yet for 2 ....</div> 
<div id="results3">Nothing has happend yet for 3 ....</div> 
</body> 


/**************** 
    Related code inside the JAVASCRIPT document 
****************/ 

function ajax_class() { 

this.meth = "GET"; 
this.file; 
this.elem; 
this.send = null; 

this.ajax_call = function (meth, file, elem, send) { 
    x = new XMLHttpRequest(); 
    x.onreadystatechange = function() { 
     if (x.readyState == 4 && x.status == 200) { 
      _id(elem).innerHTML = x.responseText; 
     } 
     else { 
      _id(elem).innerHTML = "Loading ..."; 
     } 
    } 
    x.open(meth , file, true); 
    x.send(send); 
} 
} 

Работа сейчас просто пришлось добавить «вар» перед й переменной

+1

jsfiddle пожалуйста –

+0

Если вы нашли решение, добавьте его в ответ и принять его! – likeitlikeit

ответ

1

Это, по крайней мере частично, потому что каждый new XMLHttpRequest создается в тот же глобальный x, который может содержать только 1 из них. Это означает, что последующие ссылки на x.readState и x.responseText не всегда ссылаются на экземпляр «правильный».

Вы хотите declarex когда или перед установкой его, так что это область действия и уникальной для каждого запроса Ajax:

var x = new XMLHttpRequest(); 

Для получения дополнительной информации см Difference between using var and not using var in JavaScript.

+0

Не «возможно», это точно то, что происходит. –

+0

@just_dont Я написал это, потому что не знаю, является ли это единственной проблемой. Но, пересмотренный, чтобы уточнить. –

+0

Он отлично работает сейчас, что я использовал «var» - Большое спасибо – larsrbak

0

Если вы можете использовать JQuery, ваш код будет гораздо более простой

function firstAjaxCall() { 
     return $.get('/first'); 
    } 

    function secondAjaxCall() { 
     return $.get('/second'); 
    } 

    function doFinalWork() { 
     //wrap up 
    } 

    $.when(firstAjaxCall(), secondAjaxCall()) 
     .done(function() { 
     doFinalWork(); 
     }) 
     .fail(function() { 
     console.log('Something is wrong, go fix it.'); 
    }); 
Смежные вопросы