js合并单元格

 1 jQuery(window).load(function() {
 2     //alert(1111);
 3     var tabs = document.getElementById("_single_table");
 4     var maxCols = 1, vals, counts, starts;
 5     for(var cols = maxCols-1; cols >= 0 ; cols--){
 6         counts = 1;
 7         vals = "";
 8         for(var i=0; i<tabs.rows.length; i++){
 9             if(vals == tabs.rows[i].cells[cols].innerHTML){
10                 counts++;
11             }else{
12                 if(counts > 1){ //合并
13                     starts = i - counts;
14                     tabs.rows[starts].cells[cols].rowSpan = counts;
15                     for(var j=starts+1; j<i; j++){
16                         tabs.rows[j].cells[cols].style.display = "none";
17                     }
18                     counts = 1;
19                 }
20                 vals = tabs.rows[i].cells[cols].innerHTML;
21             }
22         }
23         if(counts > 1 ){ //合并,最后几行相同的情况下
24             starts = i - counts;
25             tabs.rows[starts].cells[cols].rowSpan = counts;
26             for(var j=starts+1; j<i; j++){
27                 tabs.rows[j].cells[cols].style.display = "none";
28             }
29         }
30     }
31
32
33     var tab = document.getElementById("_proportion_tb");
34     var maxCol = 3, val, count, start;
35     for(var col = maxCol-1; col >= 0 ; col--){
36         count = 1;
37         val = "";
38         for(var i=0; i<tab.rows.length; i++){
39             if(val == tab.rows[i].cells[col].innerHTML){
40                 count++;
41             }else{
42                 if(count > 1){ //合并
43                     start = i - count;
44                     tab.rows[start].cells[col].rowSpan = count;
45                     for(var j=start+1; j<i; j++){
46                         tab.rows[j].cells[col].style.display = "none";
47                     }
48                     count = 1;
49                 }
50                 val = tab.rows[i].cells[col].innerHTML;
51             }
52         }
53         if(count > 1 ){ //合并,最后几行相同的情况下
54             start = i - count;
55             tab.rows[start].cells[col].rowSpan = count;
56             for(var j=start+1; j<i; j++){
57                 tab.rows[j].cells[col].style.display = "none";
58             }
59         }
60     }
61
62
63         var maxCol = 3, val = "", count = 1, start ,col = 6;
64         for(var i=0; i<tab.rows.length; i++){
65             if(val == tab.rows[i].cells[col].id){
66                 count++;
67             }else{
68                 if(count > 1){ //合并
69                     start = i - count;
70                     tab.rows[start].cells[col].rowSpan = count;
71                     for(var j=start+1; j<i; j++){
72                         tab.rows[j].cells[col].style.display = "none";
73                     }
74                     count = 1;
75                 }
76                 val = tab.rows[i].cells[col].id;
77             }
78         }
79         if(count > 1 ){ //合并,最后几行相同的情况下
80             start = i - count;
81             tab.rows[start].cells[col].rowSpan = count;
82             for(var j=start+1; j<i; j++){
83                 tab.rows[j].cells[col].style.display = "none";
84             }
85         }
86
87  });
时间: 2024-10-11 12:21:39

js合并单元格的相关文章

table JS合并单元格

function _w_table_rowspan(_w_table_id,_w_table_colnum){ _w_table_firsttd = ""; _w_table_currenttd = ""; _w_table_SpanNum = 0; _w_table_Obj = $(_w_table_id + " tr td:nth-child(" + _w_table_colnum + ")"); _w_table_Obj

Datatables js 复杂表头 合并单元格

x →Datatables官网← x 项目中用到的Table都是用Datatables插件来搞得: 以前都是生成一般性的table: 近期要生成一些复杂表头,合并单元格之类的: 研究了一下. x 去官网上也查到了[复杂表头(rowspan 和 colspan)(Complex headers (rowspan and colspan))],[复杂表头], 但是只是html代码,蛋疼啊... 后来看到了[创建行回调(Row created callback)]哪里的时候 ,豁然开朗!!!   先上

JS动态生成表格后 合并单元格

JS动态生成表格后 合并单元格 最近做项目碰到表格中的单元格合并的问题,需求是这样的,首先发ajax请求 请求回来后的数据 动态生成表格数据,但是生成后如果编号或者(根据其他的内容)有相同时,要合并单元格操作,在做之前也试着google下,但是网上没有碰到这方面的需求,所以自己写了一个简单的.用文字描述需求太费劲了,如下图所示: 1. 没有合并之前的图如下: 2. 合并之后的图如下: 如上所示:是根据相邻的编号相同 进行单元格合并. 先看看实现后的效果再聊吧! JSfiddle链接地址如下: 点

js 动态合并单元格并求和

需求:相同的产品名称,要合并单元格,并计算出相同产品总共消耗多少标煤. function autoRowSpan(tb, row, col) { var lastValue = ""; var value = ""; var pos = 1; var tdSum = 0; var cellValue = 0; for (var i = row; i < tb.rows.length; i++) { value = tb.rows[i].cells[col].i

前端页面表格实现合并单元格

做报表,查询的时候,经常用到表格. 页面展示多条数据时,时常表格的第一列都是相同的,所以合并单元格,让表格看起来更直观. 写这个函数,其它js里面直接调用unionTab (tb,collength);其中第一个参数tb为表格ID,第二个参数为你想要进行单元格合并的表格列数. 缺点:只能实现前N列,不能实现某一列实现合并. /**/ window.unionTab = function (tb, colLength) { var id = tb; tb = $("#" + tb).ge

easyui datagrid 合并单元格

整理以前做的东西,这个合并单元格的问题再新浪博客也写过了..... 下面这段代码是列表数据 //载入排放系数管理报表数据 function LoadEmissionReportData() { //获取计算ID var CountID = getUrlParam("CountID"); $.ajax({ type: "POST", url: "../Ashx/GetGasInventoryListInfo.ashx?type=getParamReport&

带复杂表头合并单元格的HtmlTable转换成DataTable并导出Excel(转)

步骤: 一.前台JS取HtmlTable数据,根据设定的分隔符把数据拼接起来 <!--导出Excel--> <script type="text/javascript"> //导出Excel function exportExcel() { var data = ""; $("#divRptTable").find("table").find("tr").each(function

easyUI---datagrid合并单元格代码实现

1.html部分: <div id="table1"></div> 2.js部分: $('#table1').datagrid({ data : data, loadFilter: pagerFilter, height: $(document).height()*0.87, striped: true, selectOnCheck: true, pagination: true, pageSize:10, pageList:[10,20,30,40,50],

Javascript横向/纵向合并单元格TD

在报表系统中,涉及“HTML的TD单元格的合并”恐怕为数不少. 比如,从DB查得数据并经过后台的整理后,可能是这样的: Table1     JOB TOTAL SAL INDEX EMPNO ENAME JOB MGR HIREDATE SAL COMM DEPTNO 1 ANALYST 6000 1 7788 SCOTT ANALYST 7566 4/19/1987 3000.00   20 1 ANALYST 6000 2 7902 FORD ANALYST 7566 12/3/1981