当前位置：首页 > 下载站 > js特效 > jQuery特效 > jQuery的JSON动态获取表格数据代码

jQuery的JSON动态获取表格数据代码

分类: js特效 / jQuery特效	发布时间: 2018-01-25	访问量: 1809
下载量: 59

点击下载预览效果

更多>

最新下载

jQuery加盟留言板表单代码

jQuery加盟留言板表单代码是一款加盟代理留言板表单提交页面布局样式，适用于企业通用留言板表单提交代码。

0 2025-12-26

悬浮的在线客服插件实例

PC端+移动端响应式在线客服插件。兼容性好，简洁大方。功能：返回首页、一键拨号（移动）、QQ客服、微信客服、微信公众号

0 2025-12-26

建站功能介绍tab图文布局

Query基于css3属性制作建站小程序功能特点介绍，带索引按钮控制图文布局动画演示代码。这是一款简洁的产品特点图文tab切换布局。

0 2025-12-26

jQuery水平滚动条图片切换

jQuery水平滚动条图片切换是一款基于jquery实现的随鼠标滚轮滚动的图片横向切换特效。本作品由【站长素材】收集整理，转载请注明出处！

0 2025-12-26

jQuery竖排手风琴折叠菜单代码

jQuery制作竖直手风琴滑动菜单，点击收缩展开子菜单。这一款实用的手风琴折叠菜单代码。

0 2025-12-26

verJs表单验证提示插件

verJs表单验证提示插件是一款原生js代码编写的表单验证插件，提供了常用的10种表单验证方式。

0 2025-12-26

24小时阅读排行榜

更多>

最新教程

最新Python教程从入门到精通

Node.js 教程

14520 2025-08-28
CSS3 教程

1541682 2025-08-27
Rust 教程

22173 2025-08-27
Vue 教程

24661 2025-08-22
PostgreSQL 教程

21351 2025-08-21
Git 教程

8441 2025-08-21

jQuery的JSON动态获取表格数据代码

/*双击展开关闭*/
function dbClick(obj) {
if($(obj).next().is(":hidden")) {
$(obj).next().show();
} else {
$(obj).next().hide();
}
};
$(function() {
$("#mainTable thead").next().empty();
var k = 0;
$.getJSON("revenue.json", function(data) {
$.each(data, function(mainIndex, mainTable) {
/*收入单位*/
var mainTrObj = "<tr class='mainTr warning' ondblclick='dbClick(this)'><td>" + mainTable.incomeUnit + "</td><td>" + mainTable.firm + "</td><td>" + mainTable.number + "</td><td>" + mainTable.instructionType + "</td><td>" + mainTable.dept + "</td><td>" + mainTable.totalPrice + "</td></tr>";
$("#mainTable").append(mainTrObj);
/*支出单位表头*/
var haveChild = data[k].child.length;
if(haveChild == 0) {
var nullHead = "<tr><td colspan='5' align='center'>暂无数据</td></tr>";
$("#mainTable").append(nullHead);
} else {
var smallTit = "<tr><td colspan='6'><table id='smallTable" + k + "' class='table-condensed table smallTable'><tr id='smallTr" + k + "' class='success'><td>支出结算单位</td><td>数量</td><td>支出价格</td><td>费用类型</td></tr></table></td></tr>";
$("#mainTable").append(smallTit);
}
/*支出单位遍历*/
var numnerSum = 0;
var priceSum = 0;
var unsettled = 0;
var child = data[k].child;
for(var j = 0; j < haveChild; j++) {
numnerSum = numnerSum + parseInt(child[j].number);
priceSum = priceSum + parseFloat(child[j].price);
priceSum = Math.round(priceSum * 100) / 100;
unsettled = parseFloat(mainTable.totalPrice) - priceSum;
unsettled = Math.round(unsettled * 100) / 100;
var smallTrObj = "<tr class='smallTr'><td>" + child[j].expendUnit + "</td><td>" + child[j].number + "</td><td>" + child[j].price + "</td><td colspan='2'>" + child[j].type + "</td></tr>";
$("#smallTr" + k).after(smallTrObj);
/*计算数量、价格、未结费*/
}
/*小计行*/
var totalTrObj = "<tr class='danger'><td>小计</td><td>" + numnerSum + "</td><td>" + priceSum + "</td><td align='center'>未结费     " + unsettled + "</td></tr>";
$("#smallTable" + k).append(totalTrObj);
console.log(priceSum);
console.log("未结费" + unsettled);
k++;
});
});