JavaScript动态添加列的方法
本文实例讲述了JavaScript动态添加列的方法。分享给大家供大家参考。具体实现方法如下:
/***
*动态添加table列
*@paramresult
*/
functionaddRow(resultJson){
/*vartemp=[];
temp=$.grep(arr,function(val,key){
if(val.indexOf('c')!=-1)
returntrue;
//如果[invert]参数不给或为false,$.grep只收集回调函数返回true的数组元素
//反之[invert]参数为true,$.grep收集回调函数返回false的数组元素
},false);
console.dir(temp);
*/
if(resultJson!=""){
varcv_arr=newArray();
vardate_arr=newArray();
//将数据源解析,并解析成程序可认的date及result
$.each(resultJson,function(index,val){
if(val['parser_schedule']!=null){
cv_arr.push(val['parser_schedule']);
vartemp_data=val['parser_schedule'].split(",");
for(i=0;i<temp_data.length;i++){
vartemp=temp_data[i].split(":");
date_arr.push(temp[0]);
}
}
});
date_arr=unique(date_arr);
date_arr.in_arr=function(value){
vara=this;
//为了增加方法扩展适应性。我这稍微修改了下
for(vari=0;i<a.length;i++){
if(a[i]==value)
returni;
}
}
//ARR下标值从0开始
varold_td_n=$("#mytabletheadtr").find("th").length;
//获取已有的TH
//设置TH信息
for(i=0;i<date_arr.length;i++){
//注意TH和TD,样式不一样
$("#mytabletheadtr").append("<th>"+date_arr[i]+"</th>");
$("#mytabletbodytr").append("<td>-</td>");
}
varrowNum_arr=newArray();
//获取一共有多少行
for(i=0;i<$("#mytable").find("tr").length;i++){
//获取每一行中第三列的值,table前两列隐藏,第三列开始判断是否有数据
varstr=$("#mytabletbody").find("tr").eq(i);
varstd=str.find("td").eq(2);
//当没有值的时候记录,获取行号
if($.trim(std.text()).length<1){
rowNum_arr.push(i);
}else{
//$(std).html("");
}
}
//设置TD信息
for(i=0;i<cv_arr.length;i++){
//获取RESULT_ARR中的日期数据
vartemp_str=cv_arr[i];//OK
//将日期数据用","分割成数组
vartemp_arr=temp_str.split(",");//OK[03-11:10,03-12:9,03-13:8,03-14:15]
for(j=0;j<temp_arr.length;j++){
//获取数据集为字符串例如03-11:10
vartemp_result=temp_arr[j];
/*
将数据集分割为数组[03-11:10]
ARR[0]03-11
ARR[1]10
*/
vartemp_result_arr=temp_result.split(":");
//设置第I行的TR里的内容
$("#mytabletbody").find("tr").eq(rowNum_arr[i]).find("td").eq(old_td_n+date_arr.in_arr(temp_result_arr[0])).html(temp_result_arr[1]);
//应用样式
$("#tbtr:eventd").addClass("alt");//行的颜色
$("#tbtr").find("td:eq(2)").addClass("spec");
$("#tbtr:even").find("td:eq(2)").addClass("specalt");
}
}
}
}
希望本文所述对大家的javascript程序设计有所帮助。