Question

这是我的JSON文件的片段

[{
        "id" : "61344",
        "bandappname" : null,
        "stageID" : "637",
        "title" : "The band title",
        "description" : "Some description",
        "date" : "Friday 22nd August",
        "time" : "23:00",
        "stageName" : "name of the stage",
        "startTime" : 1408662000,
        "endTime" : 1408662060,
        "weather" : {
            "iconcode" : "04n",
            "desc" : "broken clouds",
            "temp" : 17
        },
        "rating" : 0,
        "starstyle" : "",
        "userrating" : 0,
        "rated" : false,
        "plannercount" : 3,
        "eventimage" : "image.jpg",
        "lastupdated" : "1407413423",
        "activityid" : null,
        "activityliked" : null
    }
]

这样有几百个节点。有3个日期可用（第6个元素向下）和8个 stageID （第3个元素向下）

所以我想创建24个DIV来容纳每个独特的日期/阶段组合。

所以我的问题是，对于每个div，我将如何以降序输出与DIV（stageID和date）相关的以下内容（其中title和time是实际值）

title - time
title - time
title - time
...
title - time

我已尝试查看PHP and Last.fm API以及其他各种StackOverflow帖子，但已返回空白页面。我的主要问题是不知道如何遍历节点

DIV可以自动创建 - 它必须是静态的吗？我应该使用jQuery还是PHP？

我用jQuery得到了这个，但我不知道如何根据element.startTime

订购每个div中的项目

    <!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>JSON</title>
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<script>

function convertUnix (unix) {
    newDate = new Date(unix *1000)  
    var curr_hour = newDate.getHours();
    var curr_min = newDate.getMinutes();
    var convertedTime = curr_hour + ":" + curr_min;
    return convertedTime
}

$.getJSON('json.json', function(data) {
    $.each(data, function(index, element) {
        var titleTime = "(" + element.startTime + ") "+ element.title + " - " + convertUnix(element.startTime) + " - " + convertUnix(element.endTime);

        if (element.date=='Friday 22nd August') {
            $('div#'+element.stageID+'-1').append($('<p>', {text: titleTime}));
        }
        if (element.date=='Saturday 23rd August') {
            $('div#'+element.stageID+'-2').append($('<p>', {text: titleTime}));
        }
        if (element.date=='Sunday 24th August') {
            $('div#'+element.stageID+'-3').append($('<p>', {text: titleTime}));
        }
    });
});
</script>
<style> 
div {border:1px solid black; width:30%; float:left; background-color:#ccc; padding:20px; margin-left:20px;margin-bottom:20px;}
div:nth-child(3n) {clear:both; margin-bottom:20px;}
</style>
</body>

<div id="643-1"></div>
<div id="643-2"></div>
<div id="643-3"></div>

<div id="644-1"></div>
<div id="644-2"></div>
<div id="644-3"></div>

<div id="642-1"></div>
<div id="642-2"></div>
<div id="642-3"></div>

<div id="641-1"></div>
<div id="641-2"></div>
<div id="641-3"></div>

<div id="640-1"></div>
<div id="640-2"></div>
<div id="640-3"></div>

<div id="639-1"></div>
<div id="639-2"></div>
<div id="639-3"></div>

<div id="638-1"></div>
<div id="638-2"></div>
<div id="638-3"></div>

<div id="637-1"></div>
<div id="637-2"></div>
<div id="637-3"></div></html>

Answer 1

$json_str = '[{
        "id" : "61344",
        "bandappname" : null,
        "stageID" : "637",
        "title" : "The band title",
        "description" : "Some description",
        "date" : "Friday 22nd August",
        "time" : "23:00",
        "stageName" : "name of the stage",
        "startTime" : 1408662000,
        "endTime" : 1408662060,
        "weather" : {
            "iconcode" : "04n",
            "desc" : "broken clouds",
            "temp" : 17
        },
        "rating" : 0,
        "starstyle" : "",
        "userrating" : 0,
        "rated" : false,
        "plannercount" : 3,
        "eventimage" : "image.jpg",
        "lastupdated" : "1407413423",
        "activityid" : null,
        "activityliked" : null
    }
]';

$arr = json_decode($json_str);

echo $arr['stageID']." ".$arr['title']." ".$arr['date']." ".$arr['time'];

jQuery或PHP解析和过滤JSON，仅输出某些节点

1 个答案: