用 JQuery/PHP 解析嵌套的 JSON 字符串对象？
Posted
技术标签:
【中文标题】用 JQuery/PHP 解析嵌套的 JSON 字符串对象？【英文标题】：parsing nested JSON String objects with JQuery/PHP? 【发布时间】：2011-11-27 10:26:35 【问题描述】：这是我正在处理的页面.... http://fremontchurch.net/json_test/
这是json http://fremontchurch.net/json_test/posts.php
我正在尝试列出曲目名称列表，并通过简单的 html 链接 <a href="URL_GOES_HERE">TRACK NAME GOES HERE</a> 链接到其网址
我得到了其他所有东西，它只是嵌套部分不断出现“[object Object]，[object Object]，[object Object]”......等等......每个嵌套都有两个项目一个轨道名称和 url... 这样做的正确方法是什么？
这是我的 json 中的一个对象...
"id":"All Things Are Possible",
"key":"All Things Are Possible",
"doc":"All Things Are Possible",
"album":"All Things Are Possible",
"artwork":"http://godsgypsychristianchurch.net/music_artwork/DEFAULT_COVER2.png",
"baseurl":"http://www.godsgypsychristianchurch.net/music",
"church":"Atlanta GA",
"des":"All Things Are Possible from the Atlanta GA Church, Pastor Nick White",
"tracks":[
"name":"1 Intro",
"url":"/Atlanta%20GA/All%20things%20are%20possible/01%20Intro.mp3",
"name":"2 Wo si O Drom",
"url":"/Atlanta%20GA/All%20things%20are%20possible/02%20Wo%20si%20O%20drom.mp3",
"name":"3 Nas Murrgo Shov",
"url":"/Atlanta%20GA/All%20things%20are%20possible/03%20Nas%20murrgo%20shov.mp3",
"name":"4 To Cho Vos",
"url":"/Atlanta%20GA/All%20things%20are%20possible/04%20To%20cho%20vos.mp3",
"name":"5 Tu Son Kai Sastridas",
"url":"/Atlanta%20GA/All%20things%20are%20possible/05%20Tu%20son%20kai%20sastridas.mp3",
"name":"6 Now I Am Strong",
"url":"/Atlanta%20GA/All%20things%20are%20possible/06%20Now%20I%20am%20strong.mp3",
"name":"7 Sorr Nevee",
"url":"/Atlanta%20GA/All%20things%20are%20possible/07%20Zorr%20nevee.mp3",
"name":"8 Preaching",
"url":"/Atlanta%20GA/All%20things%20are%20possible/08%20Preaching.mp3",
"name":"9 Arkadyan Amey",
"url":"/Atlanta%20GA/All%20things%20are%20possible/09%20Arkadyan%20amey.mp3",
"name":"10 O Christo Ka Wudarr",
"url":"/Atlanta%20GA/All%20things%20are%20possible/10%20O%20Christo%20ka%20wudarr.mp3",
"name":"11 Eloi, Eloi",
"url":"/Atlanta%20GA/All%20things%20are%20possible/11%20Eloi%2C%20Eloi.mp3",
"name":"12 Amadow Dell",
"url":"/Atlanta%20GA/All%20things%20are%20possible/12%20Amadow%20Dell.mp3",
"name":"13 Sastiar Amey Devla",
"url":"/Atlanta%20GA/All%20things%20are%20possible/13%20Sastiar%20amey%20Devla.mp3",
"name":"14 Tu Skepeese",
"url":"/Atlanta%20GA/All%20things%20are%20possible/14%20Tu%20skepeese.mp3",
"name":"15 Dov Ma Godgee",
"url":"/Atlanta%20GA/All%20things%20are%20possible/15%20Dov%20ma%20godgee.mp3",
"name":"16 The Lord is my strength",
"url":"/Atlanta%20GA/All%20things%20are%20possible/16%20The%20Lors%20is%20my%20strength.mp3"
]
这是我所有的代码到 html/jquery/php
<html>
<body>
<div id="content">
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
var url="posts.php";
$.getJSON(url,function(json)
$.each(json.posts,function(i,post)
$("#content").append(
'<div class="post">'+
'<h1>'+post.album+'</h1>'+
'<p><img src="'+post.artwork+'"></img></p>'+
'<p><strong>'+post.church+'</strong></p>'+
'<p>Description: <strong>'+post.des+'</strong></p>'+
'<p>Base url: <em>'+post.baseurl+'</em></p>'+
'<p>Tracks: <li>'+post.tracks+'</li></p>'+
'<hr>'+
'</div>'
);
);
);
);
</script>
</body>
</html>
请回复完整的代码，因为我对这种编码有点陌生，有时我确实知道把它放在哪里......任何帮助将非常感激，谢谢......
【问题讨论】：
你不需要解析JSON你可以直接使用它，它已经是一个对象了！ 【参考方案1】：与您使用each 迭代帖子的方式相同，您可以使用each 迭代曲目。我在下面包含了完整的代码。
<html>
<body>
<div id="content">
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
var url="posts.php";
$.getJSON(url,function(json)
$.each(json.posts,function(i,post)
// Here we generate a fragment for the tracks.
var tracks = '';
$.each(post.tracks, function(j, track)
tracks += '<a href="' + track.url + '">' + track.name + '</a>';
)
$("#content").append(
'<div class="post">'+
'<h1>'+post.album+'</h1>'+
'<p><img src="'+post.artwork+'"></img></p>'+
'<p><strong>'+post.church+'</strong></p>'+
'<p>Description: <strong>'+post.des+'</strong></p>'+
'<p>Base url: <em>'+post.baseurl+'</em></p>'+
'tracks' +
'<hr>'+
'</div>'
);
);
);
);
</script>
【讨论】：
【参考方案2】：您需要遍历 post.tracks 中的每个项目，并在包含它之前将该信息收集到一个字符串中，如下所示：
$.each(json.posts,function(i,post)
var content,
trackInfo = '',
tracks = post.tracks;
// loop over the tracks and collect info
$.each(tracks, function (i)
trackInfo += '<a href="' + tracks[i].url + '">' + tracks[i].name + '</a> ';
);
content = '<div class="post">'+
'<h1>'+post.album+'</h1>'+
'<p><img src="'+post.artwork+'"></img></p>'+
'<p><strong>'+post.church+'</strong></p>'+
'<p>Description: <strong>'+post.des+'</strong></p>'+
'<p>Base url: <em>'+post.baseurl+'</em></p>'+
'<p>Tracks: <li>'+ trackInfo +'</li></p>';
'<hr>'+
'</div>'
$("#content").append(content);
);
这里的工作示例：http://jsfiddle.net/3SFE4/
【讨论】：
以上是关于用 JQuery/PHP 解析嵌套的 JSON 字符串对象？的主要内容，如果未能解决你的问题，请参考以下文章