2013-02-14 2 views
0

2 ~ 5 개의 적절한 크기의 데이터 파일이로드 된 후에 웹 페이지에서 함수를 자주로드해야합니다. 최대 3MB의 데이터가 최대 5 개의 파일로 분할된다고 가정 해 보겠습니다.N ajax 호출을위한 자바 스크립트 기능

var data1, data2; 
$(document).ajaxStop(function() { 
    $(this).unbind("ajaxStop"); //prevent running again when other calls finish 
    initialize(); 
}); 

$.ajax({ 
    url: url_to_data_1, 
    success: function (d) { 
     data1 = d; 
    } 
}); 

$.ajax({ 
    url: url_to_data_2, 
    success: function (d) { 
     data2 = d; 
    } 
}); 

function initialize() { /* do something with data1 and data2 */ } 

하지만 난 지쳤어 :

나는 그들이 모든로드 된 후 지금처럼 만드는 모든 AJAX가 동시에 호출하고, 초기화() 함수를로드하여로드 시간을 최적화하기 위해 시도 모든 시간이 붙여 넣기, 그래서 기능과 같이합니다 : ajaxStop 잡을 수 있도록 아약스 호출이 존재하지 않기 때문에 이것은 물론 작동하지 않습니다

function multi_Ajax(urls, callback) { 
    var data = {}; 

    //call init() after both the list of prayers and the word concordance index load 
    $(document).ajaxStop(function() { 
     $(this).unbind("ajaxStop"); //prevent running again when other calls finish 
     callback(data); 
    }); 

    for (var c = 0; c < urls.length; c += 1) { 
     //data files 
     $.ajax({ 
      url: urls[c], 
      dataType: "json", 
      success: function (d) { 
      data[urls[c]] = d; console.log("Loaded " + urls[c]); 
      } 
     }); 
    }  
} 

. 그러나 ajaxStop이 훨씬 더 잘 작동하는 방법을 이해하지 못합니다. 고맙습니다!

+0

당신이'$ .when()'을 찾고 있다고 생각합니다. – Barmar

+0

"ajaxStop을 잡기 위해 ajax 호출이 존재하지 않는다는 것을 무엇을 의미합니까?" –

+0

감사합니다 - 동적 입력을받을 수 있습니까? 루프에 의해 채워지는 무언가가 있습니까? EP - Ajax 호출이 루프에서 작성되면 AjaxStop이 찾을 수 있습니까? –

답변

1

두 번째 시도가 작동하지 않는 이유가 확실하지 않습니다. 문서에 따르면, ajax 요청이 완료 될 때마다 jquery는 여전히 미해결 상태 인 다른 요청이 있는지 확인하고 아무 것도없는 경우 ajaxStop을 시작합니다. 루프에서 $.ajax을 호출하면 내가 알 수있는 한 각 호출을 하드 코딩하는 것과 다르지 않아야합니다.

그러나 Barmar가 의견에서 제안한 것처럼 $.when은 사용자가 원하는 것을 더 깨끗하게 처리하는 것처럼 보입니다. 사람이 나중에 나타나서 전이나 루프 후 어딘가 관련없는 아약스 요청을 추가하는 경우 때문에 Pass in an array of Deferreds to $.when()

$.when를 사용 $.ajaxStop보다 더 깨끗한 것 같다 : 여기 $.when에 (루프에서 채울 수 있습니다) 배열을 전달하는 방법의 예 , 이는 ajaxStop이 트리거 할 때 방해가됩니다. $.when을 사용하면 기다려야하는 Ajax 요청을 명시 적으로 말할 수 있습니다.

편집 : 여기에 루프에서 발행 된 여러 통화에 대해 작업 ajaxStop을 보여주는 바이올린이있다 : http://jsfiddle.net/zYk5W/

그것은이 당신이 아약스 또는 .ajaxStop 함께 할 수 없다 위해 작동하지 않는 이유처럼 보이는; 대신 성공 콜백의 범위 문제입니다. 성공 콜백은 c 이상으로 끝나지 만 바깥 쪽 (루프) 범위에서 사용하는 것과 동일한 c입니다. 성공 콜백이 실행될 때까지 for 루프가 완료되고 curls.length으로 증가되었습니다. 따라서 성공 콜백이 실행될 때마다 urls[c]은 정의되지 않습니다. 연결된 성공 사례 나 JavaScript closure inside loops – simple practical example에서 루프의 c과 별도로 각 success 콜백에 c 범위를 부여하는 방법을 참조하십시오.

+0

정확히 내가 필요한 것, 감사합니다! 나는 그 범위 문제를 파악해야했지만, $ .when()를 사용하는 것이 확실히 좋다. –