2011-11-02 6 views
0

내가 다른 값 (앞서 의사)을 반환 여러 아약스 요청 등결합 결과는

var foo = "", bar = "", result = ""; 

$.ajax({ 
    url  : url1, 
    type : "GET", 
    data : data, 
    dataType: "json", 
    success : function(res) { 
     foo = "number of foo: " + res.foo; 
    } 
}); 

$.ajax({ 
    url  : url2, 
    type : "GET", 
    data : data, 
    dataType: "json", 
    success : function(res) { 
     bar = "number of bar: " + res.bar; 
    } 
}); 

과를 요청합니다. 내가 요청이 비동기이기 때문에, 시간에 의해 내 코드 result를 표시 할 준비가되어 있다는 보장은 없습니다, 이러한 요청을 발사 한 다음 결과를 결합하고 사용자 물론

result = foo + "\n" + bar; 

에게 제시하려는 foobar을 사용할 수 있습니다. 나는 이렇게 무언가를 해킹 할 수있다

$.ajax({ 
    url  : url1, 
    type : "GET", 
    data : data, 
    dataType: "json", 
    success : function(res) { 
     result = "number of foo: " + res.foo + "\n"; 

     $.ajax({ 
      url  : url2, 
      type : "GET", 
      data : data, 
      dataType: "json", 
      success : function(res) { 
       result += "number of bar: " + res.bar; 
       alert(result); 
      } 
     }); 
    } 
}); 

그러나, 그것은 옳지 않은 것처럼 보인다. 이 문제를 해결하기위한 더 좋은 방법에 대한 제안? jQuery를-아약스의 전체 속성을 사용하여

답변

3

간단한 변화 :

var foo = "", bar = "", result = "", comp1=false, comp2=false; 

$.ajax({ 
    url  : url1, 
    type : "GET", 
    data : data, 
    dataType: "json", 
    success : function(res) { 
     foo = "number of foo: " + res.foo; 
    }, 
    complete: function(){ 
     comp1=true; 
     comp1 && comp2 && triggerSomeEvent(); 
    } 
}); 

$.ajax({ 
    url  : url2, 
    type : "GET", 
    data : data, 
    dataType: "json", 
    success : function(res) { 
     bar = "number of bar: " + res.bar; 
    }, 
    complete: function(){ 
     comp2=true; 
     comp1 && comp2 && triggerSomeEvent(); 
    } 
}); 

function triggerSomeEvent(){//Handles completed `result` 
    result = foo + "\n" + bar; 
    //End then... 
} 
+0

super awesome. 감사. 응 ... 이걸 대답으로 받아들이려면 1 분 정도 기다려야 해. 이것이 저에게 잘 맞는 대답입니다. – punkish

+0

@ punkish no problem =) – Shad

3

당신은 아약스의 방법에 의해 반환 된 jqXHR 객체가 deferred object 사실을 이용하실 수 있습니다. $.when[docs]과 함께 다음을 수행 할 수 있습니다.

$.when($.get(url1, data), $.get(url2, data)).done(function(a1, a2) { 
    var result1 = $.parseJSON(a1[2].responseText), 
     result2 = $.parseJSON(a2[2].responseText), 
     result = "number of foo: " + result1.foo + " number of bar: " + result2.bar; 

    // do other stuff 
}); 
+1

깔끔하고 ... 배우기에 새로운 뭔가. – punkish