2012-01-19 3 views
0

JQuery로 JSON 문서를 구문 분석하려고하지만 상황이 진행되지 않습니다. 액세스하려는 피드는 "http://marketplace.envato.com/api/edge/new-files-from-user:collins,themeforest.json"에 있으며 여기에 반품 결과가 표시됩니다.JQuery로 JSON을 파싱하는 데 도움이 필요합니다.

{ 
"new-files-from-user":[ 
    { 
    "thumbnail":"http://3.s3.envato.com/files/60560.jpg", 
    "tags":"", 
    "user":"collis", 
    "url":"http://themeforest.net/item/manilla-photoshop-design/22803", 
    "live_preview_url":"http://2.s3.envato.com/files/60561/1_Home.__large_preview.jpg", 
    "uploaded_on":"Wed Dec 03 03:32:35 +1100 2008", 
    "cost":"10.00", 
    "item":"Manilla Photoshop Design", 
    "sales":"294", 
    "rating":"4", 
    "id":"22803" 
    }, 
    { 
    "thumbnail":"http://2.s3.envato.com/files/60223.jpg", 
    "tags":"clean", 
    "user":"collis", 
    "url":"http://themeforest.net/item/black-white-simple-theme/22705", 
    "live_preview_url":"http://0.s3.envato.com/files/60224/1_home.__large_preview.jpg", 
    "uploaded_on":"Tue Dec 02 04:01:12 +1100 2008", 
    "cost":"8.00","item":"Black + White Simple Theme", 
    "sales":"272"," 
    rating":"4", 
    "id":"22705" 
    }, 
    { 
    "thumbnail":"http://1.s3.envato.com/files/44556.jpg", 
    "tags":"clean", 
    "user":"collis", 
    "url":"http://themeforest.net/item/quik-v1-admin-skin/17314", 
    "live_preview_url":"http://3.s3.envato.com/files/44557/1_green.__large_preview.jpg", 
    "uploaded_on":"Fri Sep 05 07:30:24 +1000 2008","cost":"12.00", 
    "item":"Quik v1 Admin Skin", 
    "sales":"336", 
    "rating":"5", 
    "id":"17314" 
    }, 
    {"thumbnail":"http://3.s3.envato.com/files/45212.jpg", 
    "tags":"clean", 
    "user":"collis", 
    "url":"http://themeforest.net/item/freshcorp-business-template/17528", 
    "live_preview_url":"http://3.s3.envato.com/files/45213/1_Homepage.__large_preview.jpg", 
    "uploaded_on":"Tue Sep 09 06:10:50 +1000 2008", 
    "cost":"20.00", 
    "item":"FreshCorp - Business Template", 
    "sales":"277", 
    "rating":"4","id":"17528" 
    }, 
    {"thumbnail":"http://0.s3.envato.com/files/45739.jpg", 
    "tags":"clean", 
    "user":"collis", 
    "url":"http://themeforest.net/item/real-estate-html-template/17732", 
    "live_preview_url":"http://0.s3.envato.com/files/45740/1_homepage.__large_preview.jpg", 
    "uploaded_on":"Fri Sep 12 14:22:45 +1000 2008", 
    "cost":"20.00","item":"Real Estate HTML Template", 
    "sales":"175", 
    "rating":"4", 
    "id":"17732" 
    } 
] 
} 

테이블을 만들고 그 아래에 JSON 항목을 추가하는 사전 스크립트를 발견했지만 실제로하고 싶은 것은 제목과 링크가있는 이미지로 내 div를 만드는 것입니다. 항목에. 나는 무수한 튜토리얼을 시험해 보았고 JQuery API도 읽었지만, 제대로 작동하지 않는 것 같다. 누구든지 나를 도울 수 있습니까? 바로 잘못된 자바 스크립트입니다

<table id="userdata" border="1"> 
    <thead> 
     <th>Thumbnail URL</th> 
     <th>Item URL</th> 
     <th>Cost</th> 
     <th>Number of Sales</th> 
    </thead> 
    <tbody> 
    </tbody> 

</table> 

<script> 
$(document).ready(function(){ 
    $.getJSON(
     "http://marketplace.envato.com/api/edge/new-files-from-user:collins,themeforest.json", 
     function(data){ 
      $.each(data.new-files-from-user, function(i,user){ 
       var tblRow = 
        "<tr>" 
        +"<td>"+user.thumbnail+"</td>" 
        +"<td>"+user.url+"</td>" 
        +"<td>"+user.cost+"</td>" 
        +"<td>"+user.sales+"</td>" 
        +"</tr>" 
       $(tblRow).appendTo("#userdata tbody"); 
      }); 
     } 
    ); 
}); 
</script> 
+1

무엇을 작동하지 않는 이유는 무엇입니까? 어디에서 깨는거야? – hvgotcodes

+0

무엇이 당신의 질문입니까? – Hamish

+0

어디에서 깨지는 지 모르겠습니다. 나는 'new-files-from-user'속성에 대괄호를 추가했지만 여전히 아무것도 작동하지 않습니다. JSON 피드에 액세스하려고합니다. Themeforest에서 마지막 항목을 판매하려고합니다. – Matt

답변

4
data.new-files-from-user 

. 대시가있는 경우 객체 속성에 이와 같이 액세스 할 수 없습니다.

data.new - files - from - user 

물론 data.new

이 정의되지 undefined 마이너스 존재하지 않는 지역 변수는 예외가 발생 다음 JS 인터프리터는이 같은 것으로 본다.

대신 [] 구문을 사용하십시오. 이렇게하면 도트 접근 표기법에 적합하지 않은 속성에 액세스 할 수 있습니다. 이 대시가있는 경우

data['new-files-from-user'] 
+0

내 코드에 문제가있을 수 있습니까? 나는 그 속성을 괄호 안에 넣었지만 여전히 작동하지 않으려한다 : http://jsfiddle.net/2vyfg/ – Matt

+0

'data. [ 'new-files-from-user']'! ='data [ 'new-files -from-user ']'. 모든 최신 브라우저의 Javascript 콘솔은 친구입니다. –

+0

마침표를 삭제 했으므로 이제 Chrome 콘솔에 'XMLHttpRequest가 http://marketplace.envato.com/api/edge/new-files-from-user:collins,themeforest.json을로드 할 수 없음이 표시됩니다. Origin http : // localhost : 8888은 Access-Control-Allow-Origin에 의해 허용되지 않습니다. ' 지금까지 도와 주셔서 감사합니다. * 편집 : * JSON URL의 쉼표로 인한 것일 수 있지만 그 문제를 해결하는 방법이 확실하지 않습니다. – Matt

1

당신은 점 표기법으로 속성을 호출 할 수 없습니다 :

data.new-files-from-user 

대시는 빼기 연산자입니다.

시도 :

data['new-files-from-user'] 
+0

내가 놓친 다른 것이 있습니까? 제안 된 변경을했고 여전히 http://jsfiddle.net/2vyfg/ 테이블에 쓰지 않습니다. – Matt

관련 문제