var data=[
{
'name':'名称',
'id':'id',
'type':1,
'paras':[
{
'paraname':'图片名称',
'url': '',
'paratype':'1'
},
{
'paraname':'视频名称',
'url': '',
'paratype':'2'
}
]
}
]
例如这个json, 怎么在html用如下格式展现出来
name=名称
id=id
type=1
paras:paraname=图片名称
.
.
.
先写出html，需要后台数据的就用请求到的json数据变量显示被
var dtlist = null;
var dt = {};
dt.name = "dtlist";//对象名称
dt.htmllabel = "tt";//加载数据的标签
dt.method = "GET";//提交方式GET|POST
dt.form = "form2";//表单ID
dt.key = "id";//标识
dt.rows = [];
dt.showcheckbox = false;//是否显示复选框
dt.width = '100%',//宽度
dt.height = 370;//高
dt.url = '/UserInfo/GetViolationList?s=1&t=' + Math.random(),
dt.rows.push({
field: '操作', title: '操作', width: 80, align: 'center',
formatter: function (value, rowData) {
if (rowData) {
var s = "";
var s = '查看详情'
return s;
}
}
});
dt.rows.push({
width: '10%', nowrap: true, alloworder: true, field: 'It_Name', title: '企业名称', align: 'center'
});
dt.rows.push({
width: '10%', nowrap: true, alloworder: true, field: 'It_Project', title: '违规执业项目', align: 'center'
});
dt.rows.push({
width: '5%', nowrap: true, alloworder: true, field: 'It_Engineer', title: '工程师', align: 'center'
});
dt.rows.push({
width: '10%', nowrap: true, alloworder: true, field: 'It_Title', title: '违规标题', align: 'center'
});
dt.rows.push({
width: '30%', nowrap: true, alloworder: true, field: 'It_Content', title: '违规内容', align: 'center'
});
dt.rows.push({
width: '80', nowrap: true, alloworder: true, field: 'It_Icon', title: '违规图片', align: 'center',
formatter: function (value, rowData) {
var s = "";
s += '查看图片'
return s;
}
});
dt.rows.push({
width: '5%', nowrap: true, alloworder: true, field: 'It_Points', title: '违规扣分', align: 'center'
});
dt.rows.push({
width: '5%', nowrap: true, alloworder: true, field: 'It_Score', title: '成绩', align: 'center'
});
dt.rows.push({
width: '60', nowrap: true, alloworder: true, field: 'It_Date', title: '登记时间', align: 'center',
formatter: function (value, rowData) {
if (value) {
return value.toString().substr(0, 10);
}
}
});
var e=[ { 'name':'名称', 'id':'id', 'type':1, 'paras':[ { 'paraname':'图片名称', 'url': '', 'paratype':'1' }, { 'paraname':'视频名称', 'url': '', 'paratype':'2' } ] } ]
alert("name="+e[0].name+'-->id='+e[0].id+'-->paras:paraname='+e[0].paras[0].paraname);
解析json并展示到页面上：http://blog.csdn.net/qq_19558705/article/details/50329557
var data = [
{
'name': '名称',
'id': 'id',
'type': 1,
'paras': [
{
'paraname': '图片名称',
'url': '',
'paratype': '1'
},
{
'paraname': '视频名称',
'url': '',
'paratype': '2'
}
]
}
];
var v;
for (var i = 0; i < data.length; i++)
for (k in data[i]) {
v = data[i][k];
if (typeof v != 'object') document.write(k + '=' + v + '<br>');
else {
for (index in v) {
for(k1 in v[index])
document.write(k + '.' + k1 + '=' + v[index][k1] + '<br>');
}
}
}
循环遍历就行了，，，，
<!DOCTYPE html>
ajax()
$(document).ready(function(){ $("button").one("click",function(){ //使用one是为了防止重复点击按钮后不停加载数据 $.ajax({ type:'post', dataType:'json', url:'demo/demo.json', success:function(data){ //alert(data); $.each(data,function(i,obj){ //使用each方法循环遍历获取到的json数据 var nameNum=obj.name.length var name=obj.name; var age=obj.age; switch(i){ case 0: $(".table ul li").eq(0).append(name); $(".table ul li").eq(1).append(age); break; //case 1: $(".table ul li").eq(0).append(name); // $(".table ul li").eq(1).append(age); // break; //case 2 :$(".table ul li").eq(0).append(name); // $(".table ul li").eq(1).append(age); // break; } //$(".table ul li").eq(0).append(name); //$(".table ul li").eq(1).append(obj.age); }); },error:function(XMLHttpRequest,textStatus,errorThrown){ alert(errorThrown); } }); }); });
json:
[
{
'name':'desmond',
'age':'111'
},
{
'name':'liu',
'age':'1231'
},
{
'name':'jj',
'age':'211'
}
]