2011-10-12 2 views
0

JSON 개체 속성 목록을 인쇄하려고합니다. 또한 개별 ob 객체의 속성을 출력하려고했습니다. 콘솔로 출력하면 파일을 열고 두 객체와 하위 객체를 수신 중임을 나타냅니다. 그러나 나는 객체를 순환하여 각 객체의 속성을 인쇄하려고 시도하는 데 어딘가에서 실수를 저지르고있다.JSON 및 JavaScript 구문

... 
<script type="text/javascript"> 
    var dta1; 
    $(document).ready(function() { 
     $.ajax({ 
      type : "GET", 
      url : "data/data5.json", 
      success : function test(data) { 
       dta1 = data.object1; 
       dta2 = data.object2; 

       console.log("object1", dta1);    
       console.log("object2", dta2);    
      } 
     }); 
    }); 
</script> 

</head> 
<body> 
    <script type="text/javascript"> 
     for(i in dta1){ 
      document.write(dta1[i].x); 
     } 
     document.write(dta1["object11"].x); 
    </script> 
</body> 

여기에 json 파일이 있습니다.

{ 
    "object1": { 
     "object11": {"x": "10", "y": "20", "z": "30"}, 
     "object12": {"x": "40", "y": "50", "z": "60"}, 
     "object13": {"x": "70", "y": "80", "z": "90"} 
    }, 
    "object2": { 
     "object21": {"x": "100", "y": "200", "z": "300"}, 
     "object22": {"x": "400", "y": "500", "z": "600"}, 
     "object23": {"x": "700", "y": "800", "z": "900"} 
    } 
} 
+0

는 것을 어떻게 알 수 있습니까 예를 들어, 귀하의 HTML에서 컨테이너 요소를 만드는 것입니다 인쇄 할 때 dta1이로드 되었습니까? – lc2817

+0

lc2817, console.log ("object1", dta1); <- Chrome 개발 도구 (콘솔 탭에 있음)를 통해 브라우저에 정보를 표시합니다. –

+0

저는 HTML 부분에 대해서 이야기하고 있습니다. 정확히 그 대답에 설명되어 있습니다. – lc2817

답변

4

두 번째 스크립트 블록으로 인해 문서가 완전히로드 된 후에 만 ​​실행하는 jQuery를 "문서 준비"핸들러의 사용에 머리에 하나 전에 실행됩니다.

또한 다음 번 코드 실행 전에 비동기 요청 (AJAX)을 완료 할 수 없습니다. AJAX를 통해 검색된 데이터를 사용하는 모든 것은 "성공"콜백 내에서 호출되어야합니다.

당신이 할 아마해야 할 것은

<body> 
    <ul id="data-container"></ul> 
</body> 

와 AJAX 성공 콜백 내 것과 값을 추가, 예를 들어

success : function test(data) { 
    var dta1 = data.object1; 
    var dta2 = data.object2; 

    var container = $("#data-container"); 

    for (var o in dta1) { 
     if (dta1.hasOwnProperty(o)) { 
      container.append($("<li>").text(dta1[o].x)); 
     } 
    } 
} 
+0

대단히 감사합니다! –

관련 문제