研究了一下午,贴出自己的代码把,有的地方是土办法就是了,而且改了结构
Titleth, td {
vertical-align: middle !important;
text-align: center;
}
h1 {
text-align: center;
}
示例
救助月份救助单位救助类别救助人次
20160120512232061223效果
救助月份救助单位救助类别救助人次救助金额
var data = [
{
label: "2016年01月",
children: [
{
label: "单位1",
children: [
{
label: "救助类别1",
jzrc: "23",
jzje: "24"
}
]
},
{
label: "单位2",
children: [
{
label: "救助类别3",
jzrc: "25",
jzje: "26"
},
{
label: "救助类别4",
jzrc: "27",
jzje: "28"
}
]
},
{
label: "单位3",
children: [
{
label: "救助类别5",
jzrc: "25",
jzje: "28"
},
{
label: "救助类别6",
jzrc: "22",
jzje: "21"
},
{
label: "救助类别7",
jzrc: "11",
jzje: "111"
}
]
}
]
},
{
label: "2016年02月",
children: [
{
label: "单位4",
children: [
{
label: "救助类别8",
jzrc: "11",
jzje: "22"
}
]
}
]
}
];
var $tBody = $("#demo tbody");
/**
* 查找字符串出现次数
* @param str
* @param substr
* @returns {*}
*/
function countSubstr(str, substr) {
var count;
var reg = "/" + substr + "/gi"; //查找时忽略大小写
reg = eval(reg);
if (str.match(reg) == null) {
count = 0;
} else {
count = str.match(reg).length;
}
return count;
//返回找到的次数
}
/**
* 根据数据判断子级是不是都已经渲染完成
* @param data
*/
function isChildrenRendered(data) {
var isRendered = true;
if (typeof data == 'undefined') console.info(data);
for (var i = 0; i < data.length; i++) {
if (!data[i].rendered) {
isRendered = false;
break;
} else {
if (data[i].children) {
for (var j = 0; j < data[i].children.length; j++) {
if (!data[i].children[j].rendered) {
if (isRendered) {
isRendered = false;
break;
}
}
}
}
}
}
return isRendered;
}
function addOne(data) {
//TODO 土办法:先将json转换成字符串,然后查找某个必有属性,从而得出需要几行
var counts = countSubstr(JSON.stringify(data), 'jzje');
for (var i = 0; i < counts; i++) {
var $tr = $("
");//添加月份
if (!data.rendered) {
$tr.append("
" + data.label + "");data.rendered = true;
}
for (var j = 0; j < data.children.length; j++) {
//如果子级还没渲染完成
if (!isChildrenRendered(data.children[j].children)) {
if (!data.children[j].rendered) {
data.children[j].rendered = true;
//添加救助单位
$tr.append("
" + data.children[j].label + "");}
for (var k = 0; k < data.children[j].children.length; k++) {
if (!data.children[j].children[k].rendered) {
data.children[j].children[k].rendered = true;
//添加救助类别、救助人次、救助金额
$tr.append("
" + data.children[j].children[k].label + "");$tr.append("
" + data.children[j].children[k].jzrc + "");$tr.append("
" + data.children[j].children[k].jzje + "");break;
}
}
break;
}
}
$tBody.append($tr);
}
}
for (var i = 0; i < data.length; i++) {
addOne(data[i]);
}