Как я могу получить javascript для чтения из .json файла?

Теперь мой script выглядит следующим образом:

<script type="text/javascript">
  function updateMe(){
    var x = 0;
    var jsonstr = '{"date":"July 4th", "event":"Independence Day"}';
    var activity=JSON.parse(jsonstr);
    while(x<10){
    date = document.getElementById("date"+x).innerHTML = activity.date;
    event = document.getElementById("event"+x).innerHTML = activity.event;
    x++;
    }
  }
</script>

Где дата "x" и событие "x" представляют собой серию html-тегов. Эта функция работает, когда страница загружается (загружается). Моя цель - сделать это точно так же, только из локального файла .json, в отличие от жесткого кода, который у меня выше. Я уже проверил http://api.jquery.com/jQuery.getJSON/.

Локальный файл .json выглядит следующим образом:

{"date":"July 4th", "event":"Independence Day"}

Любые предложения?

Ответы

Ответ 1

Предполагая, что вы имеете в виду "файл в локальной файловой системе", когда вы говорите файл .json.

Вам нужно сохранить данные json, отформатированные как jsonp, и использовать file:// url для доступа к нему.

Ваш HTML будет выглядеть так:

<script src="file://c:\\data\\activity.jsonp"></script>
<script type="text/javascript">
  function updateMe(){
    var x = 0;
    var activity=jsonstr;
    foreach (i in activity) {
        date = document.getElementById(i.date).innerHTML = activity.date;
        event = document.getElementById(i.event).innerHTML = activity.event;
    }
  }
</script>

И файл c:\data\activity.jsonp содержит следующую строку:

jsonstr = [ {"date":"July 4th", "event":"Independence Day"} ];

Ответ 2

Вы можете сделать это как... Просто укажите правильный путь к вашему json файлу...

<!doctype html>
<html>
    <head>
        <script type="text/javascript" src="abc.json"></script>
             <script type="text/javascript" >
                function load() {
                     var mydata = JSON.parse(data);
                     alert(mydata.length);

                     var div = document.getElementById('data');

                     for(var i = 0;i < mydata.length; i++)
                     {
                        div.innerHTML = div.innerHTML + "<p class='inner' id="+i+">"+ mydata[i].name +"</p>" + "<br>";
                     }
                 }
        </script>
    </head>
    <body onload="load()">
    <div id= "data">

    </div>
    </body>
</html>

Просто получите данные и добавьте их в div... Первоначально печатайте длину в режиме оповещения.

Вот мой файл Json: abc.json

data = '[{"name" : "Riyaz"},{"name" : "Javed"},{"name" : "Arun"},{"name" : "Sunil"},{"name" : "Rahul"},{"name" : "Anita"}]';