Форум

jsnoob4ik · #1 (**permalink**) 18.12.2014, 21:11

Имеется:

{
  "items": [
    {
      "id": "01",
      "text": "TEXT",
      "likes": {
        "count": 1,
        "can_like": 1
      },
      "date": 0000,
      "comments": {
        "count": 1,
        "can_post": 1
      },
      "attachments": [
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://1.jpg",
            "date": 0000,
            "id": 01
          }
        }
      ]
    },
    {
      "id": "02",
      "text": "TEXT2",
      "likes": {
        "count": 2,
        "can_like": 2
      },
      "date": 0000,
      "comments": {
        "count": 2,
        "can_post": 2
      },
      "attachments": [
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://2.jpg",
            "date": 0000,
            "id": 02
          }
        },
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://3.jpg",
            "date": 0000,
            "id": 03
          }
        },
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://4.jpg",
            "date": 0000,
            "id": 04
          }
        }
      ]
    }
  ]
}

<div id="box"></div>

    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script>
    $.getJSON('test.json', function(data) {
        var output="<div>";        
        for (var i in data.items) {
            output+="<div>" + data.items[i].id + "</div>";
            output+="<div>" + data.items[i].text + "</div>";
            output+="<div>" + data.items[i].likes.count + "</div>";
            output+="<div>" + data.items[i].comments.count + "</div>";
            output+="<div>" + data.items[i].attachments[0].photo.photo_130 + "</div>";
          }
          output+="</div>";
        }
        document.getElementById("box").innerHTML=output;
    });
    </script>

На выходе получаю пустую страницу

рони · #2 (**permalink**) 18.12.2014, 21:18

jsnoob4ik,
15 строка

jsnoob4ik · #3 (**permalink**) 18.12.2014, 21:20

Исправил. Теперь так выглядит

<div id="box"></div>

    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script>
    $.getJSON('test.json', function(data) {
        var output="<div>";        
        for (var i in data.items) {
            output+="<div>" + data.items[i].id + "</div>";
            output+="<div>" + data.items[i].text + "</div>";
            output+="<div>" + data.items[i].likes.count + "</div>";
            output+="<div>" + data.items[i].comments.count + "</div>";
            /*output+="<div>" + data.items[i].attachments[0].photo.photo_130 + "</div>";*/
          }
          output+="</div>";
        document.getElementById("box").innerHTML=output;
    });
    </script>

Все равно пустую страницу отдает.

рони · #4 (**permalink**) 18.12.2014, 21:27

jsnoob4ik,
а data есть?

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
</head>

<body>  <div id="box"></div>
<script>
var data = {
  "items": [
    {
      "id": "01",
      "text": "TEXT",
      "likes": {
        "count": 1,
        "can_like": 1
      },
      "date": 0000,
      "comments": {
        "count": 1,
        "can_post": 1
      },
      "attachments": [
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://1.jpg",
            "date": 0000,
            "id": 01
          }
        }
      ]
    },
    {
      "id": "02",
      "text": "TEXT2",
      "likes": {
        "count": 2,
        "can_like": 2
      },
      "date": 0000,
      "comments": {
        "count": 2,
        "can_post": 2
      },
      "attachments": [
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://2.jpg",
            "date": 0000,
            "id": 02
          }
        },
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://3.jpg",
            "date": 0000,
            "id": 03
          }
        },
        {
          "type": "photo",
          "photo": {
            "photo_130": "http://4.jpg",
            "date": 0000,
            "id": 04
          }
        }
      ]
    }
  ]
}
var output="<div>";
        for (var i in data.items) {
            output+="<div>" + data.items[i].id + "</div>";
            output+="<div>" + data.items[i].text + "</div>";
            output+="<div>" + data.items[i].likes.count + "</div>";
            output+="<div>" + data.items[i].comments.count + "</div>";
           for (var k in data.items[i].attachments) output+="<div>" + data.items[i].attachments[k].photo.photo_130 + "</div>";
          }
          output+="</div>";

        document.getElementById("box").innerHTML=output;

</script>



</body>

</html>

jsnoob4ik · #5 (**permalink**) 18.12.2014, 21:34

json данные находятся в отдельном файле. test.json Проверил Ваш код, он отрабатывает, но не полноценно. Не выводятся Фото3, Фото4

рони · #6 (**permalink**) 18.12.2014, 22:24

Сообщение от jsnoob4ik

Не выводятся Фото3, Фото4

а вы их не выводите как они сами что-ли покажутся

рони · #7 (**permalink**) 18.12.2014, 22:29

jsnoob4ik,
добавил вывод строка 83

jsnoob4ik · #8 (**permalink**) 18.12.2014, 22:51

Спасибо, действительно работает (в том виде что Вы прислали). Но с подгрузкой из отдельного файла почему то не хочет работать. Не подскажите в чем проблема?

рони · #9 (**permalink**) 18.12.2014, 22:56

jsnoob4ik,
скорее всего сервер присылает не строку а обьект -- вам же виднее что приходит в дата

jsnoob4ik · #10 (**permalink**) 18.12.2014, 23:39

Все верно. Но как же сделать так, что бы он присылал строку а не объект?

Форум

Справочник

Discord чат

Курсы javascript