루프 내에서 $ .getJSON 사용

조금 배우기 JSON 페이스 북을 가지고 놀다 Graph API.

내가 뭘하려고 : 나는 축구 팀의 목록과 페이스 북에 그룹의 ID가 있습니다. 팀은 팀 배열에 저장되고 facebook ID는 teamID 배열에 저장됩니다. 그런 다음 루프를 작성하여 $.getJSON이 포함 된 함수를 호출하고 각 그룹의 좋아하는 항목을 검색하려고합니다. 문제는 첫 번째 팀만 인쇄 한 다음 나머지 브라우저 결과를 채우지 않고 브라우저 창을 인쇄한다는 것입니다.

나는 다음과 같은 코드가 있습니다까지 정확한에서이 아니다

var team = ['aek','ael','aris','iraklis','kavala']; 
var teamID = ['110422719032276','129322810472059','182829608421864','191854030839850','192175080800352'] 

$(document).ready(function() { 
    for(var i=0; i<5; i++) { 
    retrieveData(team[i],teamID[i]); 
    } 

}); 

function retrieveData(teamName,id) { 
    var baseURL = 'http://graph.facebook.com/'; 
    $.getJSON(baseURL+id+"&callback=?", function(data) { 
     document.write(teamName+" :"+data.likes) 
    }); 

};

출처

2011-03-03 Sotiris

"... 첫 번째 팀만 인쇄 한 다음"... 다음에 ** 무엇을 **? – Pointy

나는 이것을 가로 질러 왔고 나는 공유 할 것이라고 생각했다 : http://stackoverflow.com/questions/802854/why-is-document-write-considered-a-bad-practice – orolo

@orolo thanks for the link :) – Sotiris

을, 그러나 당신은 페이지로 가져온 데이터를 넣어 document.write()을 사용할 수 없습니다. 대신 필요한 경우 DOM에 항목을 추가해야합니다.

예를 들어, 당신이 뭔가를 할 수 있습니다 :

<div id='teamList'> 
    <!-- teams go here --> 
</div>

페이지 :

function retrieveData(teamName,id) { 
    var baseURL = 'http://graph.facebook.com/'; 
    $.getJSON(baseURL+id+"&callback=?", function(data) { 
     $('#teamList').append('<div>' + teamName+" :"+data.likes + '</div>') 
    }); 

};

이 같은이 있다면.

출처

2011-03-03 15:32:27 Pointy

이것은이다. 올바른, 여기에 내가했던 빠른 테스트 - http://jsfiddle.net/9kb27/ –

덕분에,이 위대한 작품, 나는'document.write()'문제라고 생각하지 않았다. 다시 한 번 감사드립니다 – Sotiris

Jquery 템플릿은 Json 객체에서 HTML을 생성하는 데 매우 유용합니다. https://github.com/jquery/jquery-tmpl 및 튜토리얼 http://www.borismoore.com/2010/09를 확인하십시오. /introducing-jquery-templates-1-first.html –

루프 내에서 $ .getJSON 사용

답변

관련 문제