2017-04-21 1 views
1

키와 값을 가져 오려고하는 JSON 파일이 있지만이 함수는 성공하지 않습니다. 'datafile.json'은 동일한 디렉토리에 있습니다. 알림 (weblink)은 실행되지 않지만 알림 ('test 1')은 정상적으로 작동합니다.Ajax JSON 파일을 요청하지 않습니다.

<div class="container"> 
    <table class="table table-bordered table-striped table-hover" align="center"> 
     <col width="50%"> 
     <col> 
     <col width="15%"> 
     <col width="25%"> 
     <thead> 
      <tr bgcolor="#76767a" align="right"> 
       <th align="left">Skill</th> 
       <th>Rank</th> 
       <th>Level</th> 
       <th>Experience</th> 
      </tr> 
     </thead> 
    </table> 
</div> 

<script> 
var weblink = 'datafile.json'; 
var data = {}; 
$(document).ready(function(){ 
    alert('test 1');  
    $.ajax({ 
     type : 'GET', 
     dataType : 'json', 
     url : weblink, 
     success: function(data){ 
      alert(weblink); 
      $.each(datas, function(key, val){ 
      items.push("<tr>"); 
      items.push("<td id =''"+key+"''>"+val.skill+"</td>"); 
      items.push("<td id =''"+key+"''>"+val.rank+"</td>"); 
      items.push("<td id =''"+key+"''>"+val.level+"</td>"); 
      items.push("<td id =''"+key+"''>"+val.exp+"</td>"); 
      items.push("</tr>"); 
      }); 
      $("<tbody/>", {"class": "mydata", html: items.join("")}).appendTo("table"); 
     } 
    }); 
}); 

</script> 

내 datafile.json이다 : 당신은 스크립트 태그를 사용하여 JSON 파일을로드 할 수 있습니다

[ 
{ 
"Skill": "Overall", 
"Rank": "1132673", 
"Level": "420", 
"Exp": "466345" 
}, 
{ 
"Skill": "Attack", 
"Rank": "1256428", 
"Level": "23", 
"Exp": "6563" 
}, 
{ 
"Skill": "Defence", 
"Rank": "1182611", 
"Level": "28", 
"Exp": "11069" 
}, 
{ 
"Skill": "Strength", 
"Rank": "1250418", 
"Level": "22", 
"Exp": "6238" 
}, 
{ 
"Skill": "Constitution", 
"Rank": "1292788", 
"Level": "27", 
"Exp": "10413" 
}, 
{ 
"Skill": "Ranged", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Prayer", 
"Rank": "1116462", 
"Level": "20", 
"Exp": "4611" 
}, 
{ 
"Skill": "Magic", 
"Rank": "1058028", 
"Level": "32", 
"Exp": "18183" 
}, 
{ 
"Skill": "Cooking", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Woodcutting", 
"Rank": "955909", 
"Level": "47", 
"Exp": "79651" 
}, 
{ 
"Skill": "Fletching", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Fishing", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Firemaking", 
"Rank": "668820", 
"Level": "58", 
"Exp": "245606" 
}, 
{ 
"Skill": "Crafting", 
"Rank": "1060629", 
"Level": "16", 
"Exp": "3090" 
}, 
{ 
"Skill": "Smithing", 
"Rank": "956265", 
"Level": "35", 
"Exp": "24400" 
}, 
{ 
"Skill": "Mining", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Herblore", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Agility", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Thieving", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Slayer", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Farming", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Runecrafting", 
"Rank": "619807", 
"Level": "42", 
"Exp": "49314" 
}, 
{ 
"Skill": "Hunter", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Construction", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Summoning", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Dungeoneering", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Divination", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Invention", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
} 
] 
+0

: HTTP 서버 –

+0

이 모두 사용 내 서버에 있습니다. 내 웹 페이지가 제대로로드되지만 동일한 디렉토리의 JSON에 액세스 할 수 없습니다. – BrandonNova

+0

오타. datas! == data –

답변

0

. 선택적으로 .js 확장자를 지정하십시오. 변수에 변수를 지정해야합니다. 자바 스크립트처럼 처리되지만 어쩌면 그 변수가 작동 할 수 있습니다.

<script type="text/javascript" language="javascript" src="datafile.json"></script> 
<div class="container"> 
    <table class="table table-bordered table-striped table-hover" align="center"> 
     <col width="50%"> 
     <col> 
     <col width="15%"> 
     <col width="25%"> 
     <thead> 
      <tr bgcolor="#76767a" align="right"> 
       <th align="left">Skill</th> 
       <th>Rank</th> 
       <th>Level</th> 
       <th>Experience</th> 
      </tr> 
     </thead> 
    </table> 
</div> 

<script> 
// var data is defined in the json script 
$(window).load(function(){ 
    $.each(data, function(skill) { 
     items.push("<tr>"); 
     $.each(skill, function(key, val){ 
      items.push("<td id =''"+key+"''>"+val.skill+"</td>"); 
      items.push("<td id =''"+key+"''>"+val.rank+"</td>"); 
      items.push("<td id =''"+key+"''>"+val.level+"</td>"); 
      items.push("<td id =''"+key+"''>"+val.exp+"</td>"); 
     }); 
     items.push("</tr>"); 
    }) 

    $("<tbody/>", {"class": "mydata", html: items.join("")}).appendTo("table"); 
}); 

</script> 

datafile.json 당신이 HTTP 서버를 사용하지 않는, 당신은 ...이 작동하지 않습니다 솔루션을 크롬을 사용하는 경우

var data = 
[ 
{ 
"Skill": "Overall", 
"Rank": "1132673", 
"Level": "420", 
"Exp": "466345" 
}, 
{ 
"Skill": "Attack", 
"Rank": "1256428", 
"Level": "23", 
"Exp": "6563" 
}, 
{ 
"Skill": "Defence", 
"Rank": "1182611", 
"Level": "28", 
"Exp": "11069" 
}, 
{ 
"Skill": "Strength", 
"Rank": "1250418", 
"Level": "22", 
"Exp": "6238" 
}, 
{ 
"Skill": "Constitution", 
"Rank": "1292788", 
"Level": "27", 
"Exp": "10413" 
}, 
{ 
"Skill": "Ranged", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Prayer", 
"Rank": "1116462", 
"Level": "20", 
"Exp": "4611" 
}, 
{ 
"Skill": "Magic", 
"Rank": "1058028", 
"Level": "32", 
"Exp": "18183" 
}, 
{ 
"Skill": "Cooking", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Woodcutting", 
"Rank": "955909", 
"Level": "47", 
"Exp": "79651" 
}, 
{ 
"Skill": "Fletching", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Fishing", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Firemaking", 
"Rank": "668820", 
"Level": "58", 
"Exp": "245606" 
}, 
{ 
"Skill": "Crafting", 
"Rank": "1060629", 
"Level": "16", 
"Exp": "3090" 
}, 
{ 
"Skill": "Smithing", 
"Rank": "956265", 
"Level": "35", 
"Exp": "24400" 
}, 
{ 
"Skill": "Mining", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Herblore", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Agility", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Thieving", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Slayer", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Farming", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Runecrafting", 
"Rank": "619807", 
"Level": "42", 
"Exp": "49314" 
}, 
{ 
"Skill": "Hunter", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Construction", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Summoning", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Dungeoneering", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Divination", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
}, 
{ 
"Skill": "Invention", 
"Rank": "0", 
"Level": "1", 
"Exp": "0" 
} 
]; 
+0

Didnt는 무엇이든을 돕는다. 이 코드를 추가하기 전에 datafile.json은 개발자 도구를 통해 소스에 나타나지 않습니다. 이제는 기능에서 성공하지만 여전히 성공합니다. – BrandonNova

+0

당신은 더 이상 아약스가 필요 없으며 변수를 직접 사용할 수 있습니다. 아프다 답답한 – chris

+0

알겠습니다. 나는 그것을 볼 것이다. 감사. – BrandonNova

관련 문제