使用jQuery操作HTML的table表格的实例解析

使用jQuery操作HTML的table表格的实例解析

最终效果图:

使用jQuery操作HTML的table表格的实例解析

简单来看一下其中的主要部分:

HTML:

.td_back_color {
background-color: red;
}
.td_center {
text-align: center;
font-weight:bold;
}

CSS:

……

2013春节聚会收支统计
姓名 吃饭 KTV 烧烤 支出 应付
周竞成

JavaScript:

var data = [ {
picture : “http://ww1.sinaimg.cn/mw690/51baa38egw1dzl6l2hjchj.jpg”,
name : “周竞成”,
leftTime : “二月五号”,
phone : “186****2296”,
qq : “”,
workedIn : “浙江 杭州”,
cost : 200,
project : “吃饭,KTV,烧烤”
}, ……..

// 初始化shuju
var init = function() {
var tbl_count = $(“#tbl_count tr:gt(0)”);
// 吃饭
var meal_text = $(“#tbl_count tr:first th:eq(1)”).text();
// KTV
var ktv_text = $(“#tbl_count tr:first th:eq(2)”).text();
// 烧烤
var bbq_text = $(“#tbl_count tr:first th:eq(3)”).text();

$.each(tbl_count, function(i,v){
var tr_info = tbl_count.eq(i);
for (var i = 0; i

© 版权声明

相关文章

暂无评论

none
暂无评论...