我有一个名为movie.json
的外部JSON文件,就像格式
{
"action":
[
{ "id": "1001", "name": "Matrix" },
{ "id": "1002", "name": "IP Man" },
{ "id": "1003", "name": "Revenge" }
],
"comedy":
[
{ "id": "2001", "type": "Iceman" },
{ "id": "2002", "type": "Pat & Mat" },
{ "id": "2003", "type": "Sugar" }
],
"animation":
[
{ "id": "3001", "type": "Frozen" },
{ "id": "3002", "type": "Tangled" },
{ "id": "3003", "type": "Croods" }
]
}
在我的HTML中我有一个像
这样的引导Tab组件<ul class="nav nav-tabs" role="tablist">
</ul>
是否可以告诉我如何访问上级JSON文件action, comedy, animation
并将其li
动态填充为.nav-tabs
我已经尝试了
$.getJSON('data.json', function (data) {
for (i = 0; i < data.length; i++) {
$('.nav-tabs').append('<li role="presentation" ><a href="#'+data[0]+'" aria-controls="'+data[0]+'" role="tab" data-toggle="tab">'+data[0]+'</a></li>')
}
});
但它没有完成这项工作。你能告诉我怎么解决这个问题吗?感谢
答案 0 :(得分:1)
您可以使用$.each()
来迭代数据。 key将是“顶级”和val内容
$.getJSON('data.json', function (data) {
$.each( data, function( key, val ) {
$('.nav-tabs').append('<li role="presentation" ><a href="#'+key+'" aria-controls="'+key+'" role="tab" data-toggle="tab">'+key+'</a></li>')
});
});
答案 1 :(得分:0)
您将对象视为数组,它是一个简单的对象使用for-in
loop
for...in
语句以任意顺序迭代对象的可枚举属性。对于每个不同的属性,可以执行语句。
var data = {
"action": [{
"id": "1001",
"name": "Matrix"
},
{
"id": "1002",
"name": "IP Man"
},
{
"id": "1003",
"name": "Revenge"
}
],
"comedy": [{
"id": "2001",
"name": "Iceman"
},
{
"id": "2002",
"name": "Pat & Mat"
},
{
"id": "2003",
"name": "Sugar"
}
],
"animation": [{
"id": "3001",
"name": "Frozen"
},
{
"id": "3002",
"name": "Tangled"
},
{
"id": "3003",
"name": "Croods"
}
]
};
for (var i in data) {
$('.nav-tabs').append('<li><strong>' + i + '<strong></li>')
for (var j = 0; j < data[i].length; j++) {
var obj = data[i][j];
$('.nav-tabs').append('<li>' + obj.name + '</li>')
}
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul class="nav nav-tabs" role="tablist">
</ul>
&#13;
答案 2 :(得分:0)
<?php
while(stream_select($in = [STDIN], $out = [], $oob = [],0)){
fgetc(STDIN);
}
?>