js解析json添加到表格并分页
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
vartableData = [ {
"C0" : "临夏州_康乐县",
"C1" : 190893.39,
"C2" : 24544.65,
"AREA_ID" : "930013005"
}, {
"C0" : "临夏州_永靖县",
"C1" : 368900.35,
"C2" : 40592.19,
"AREA_ID" : "930013006"
}, {
"C0" : "兰州市_东岗分局",
"C1" : 88.48,
"C2" : 126.4,
"AREA_ID" : "930013106"
}, {
"C0" : "临夏州_临夏县",
"C1" : 107337.9,
"C2" : 20612.1,
"AREA_ID" : "930013008"
}, {
"C0" : "临夏州_广河县",
"C1" : 69738.07,
"C2" : 34894.44,
"AREA_ID" : "930013003"
}, {
"C0" : "临夏州_和政县",
"C1" : 46622.96,
"C2" : 20954.97,
"AREA_ID" : "930013002"
}, {
"C0" : "临夏州_东乡县",
"C1" : 96021.84,
"C2" : 16725.63,
"AREA_ID" : "930013004"
}, {
"C0" : "临夏州_临夏市中心",
"C1" : 1845311.12,
"C2" : 129478.93,
"AREA_ID" : "930013001"
}, {
"C0" : "天水市_秦州区",
"C1" : 0,
"C2" : 0,
"AREA_ID" : "930013801"
}, {
"C0" : "临夏州_积石山",
"C1" : 256181.79,
"C2" : 15185.98,
"AREA_ID" : "930013007"
}, {
"C0" : "酒泉_肃州区",
"C1" : 264312,
"C2" : 402.6,
"AREA_ID" : "930013701"
} ];
var columns = [ {
"cid" : "C0",
"ctext" : "区县"
}, {
"cid" : "C1",
"ctext" : "客户总收入"
}, {
"cid" : "C2",
"ctext" : "当月出账费用"
} ];
/**
page:页码
pageSize:每页的记录条数
此方法除了传入page和pageSize之外,还应知道的有三个参数:
一、表的全部数据,json串格式,可通过action查询数据库得到。
二、表头所对应的列的key及名称,也是json串格式
三、表所对应的id
注:此处只是适合表头只有一行,且事先写好的情况。您可以根据需要改一下,逻辑思路就是这样,欢迎批评指正。
*/
functionsplitPage(page, pageSize) {
varptable = document.getElementById("page_table");
varnum = ptable.rows.length;//table.rows返回表格中包含的所有行,此处假设表由表头1行和表体N行组成
//alert(num);
//清除tbody
for ( vari = num - 1; i> 0; i--) {
ptable.deleteRow(i);
}
vartotalNums = tableData.length;//总行数
vartotalPage = Math.ceil(totalNums / pageSize);//总页数
var begin = (page - 1) * pageSize;//页起始位置(包括)
var end = page * pageSize;//页结束位置(不包括)
end = end >totalNums ? totalNums : end;
//向tbody中写入数据
var n = 1;//tbody的起始行
for ( vari = begin; i< end; i++) {
var row = ptable.insertRow(n++);
varrowData = tableData[i];
for ( var j = 0; j var col = columns[j].cid; var cell = row.insertCell(j); varcellData = rowData[col]; cell.innerHTML = cellData; } } //生成分页工具条 varpageBar = "第" + page + "页/共" + totalPage + "页" + " "; if (page > 1) { pageBar += " + ");\">首页 } else { pageBar += "首页"; } if (page > 1) { pageBar += " + pageSize + ");\">上一页 } else { pageBar += "上一页"; } if (page