在Grid加载完成后直接调用此方法,需要注意的是,合并的单元格值必须一样。
1 /** 2 * 合并单元格 3 * @param {} grid 要合并单元格的grid对象 4 * @param {} cols 要合并哪几列 [1,2,4] 5 */ 6 7 function mergeCells(grid, cols) { 8 var arrayTr = document.getElementById(grid.getId() + "-body").firstChild.firstChild.firstChild 9 .getElementsByTagName('tr'); 10 //var arrayTr = document.getElementById(grid.getId()+"-body").firstChild.nextSibling; 11 //var arrayTr = Ext.get(grid.getId()+"-body").first().first().first().select("tr"); 12 var trCount = arrayTr.length; 13 var arrayTd; 14 var td; 15 var merge = function(rowspanObj, removeObjs) { //定义合并函数 16 if (rowspanObj.rowspan != 1) { 17 arrayTd = arrayTr[rowspanObj.tr].getElementsByTagName("td"); //合并行 18 td = arrayTd[rowspanObj.td - 1]; 19 td.rowSpan = rowspanObj.rowspan; 20 td.vAlign = "middle"; 21 Ext.each(removeObjs, function(obj) { //隐身被合并的单元格 22 arrayTd = arrayTr[obj.tr].getElementsByTagName("td"); 23 arrayTd[obj.td - 1].style.display = 'none'; 24 }); 25 } 26 }; 27 var rowspanObj = {}; //要进行跨列操作的td对象{tr:1,td:2,rowspan:5} 28 var removeObjs = []; //要进行删除的td对象[{tr:2,td:2},{tr:3,td:2}] 29 var col; 30 31 Ext.each(cols, function(colIndex) { //逐列去操作tr 32 var rowspan = 1; 33 var divHtml = null; //单元格内的数值 34 for (var i = 1; i < trCount; i++) { //i=0表示表头等没用的行 35 arrayTd = arrayTr[i].getElementsByTagName("td"); 36 var cold = 0; 37 Ext.each(arrayTd, function(Td) { //获取RowNumber列和check列 38 if (Td.getAttribute("class") 39 .indexOf("x-grid-cell-special") != -1) 40 cold++; 41 }); 42 col = colIndex + cold; //跳过RowNumber列和check列 43 if (!divHtml) { 44 divHtml = arrayTd[col - 1].innerHTML; 45 rowspanObj = { 46 tr : i, 47 td : col, 48 rowspan : rowspan 49 } 50 } else { 51 var cellText = arrayTd[col - 1].innerHTML; 52 var addf = function() { 53 rowspanObj["rowspan"] = rowspanObj["rowspan"] + 1; 54 removeObjs.push({ 55 tr : i, 56 td : col 57 }); 58 if (i == trCount - 1) 59 merge(rowspanObj, removeObjs);//执行合并函数 60 }; 61 var mergef = function() { 62 merge(rowspanObj, removeObjs);//执行合并函数 63 divHtml = cellText; 64 rowspanObj = { 65 tr : i, 66 td : col, 67 rowspan : rowspan 68 } 69 removeObjs = []; 70 }; 71 if (cellText == divHtml) { 72 if (colIndex != 1) { 73 var leftDisplay = arrayTd[col - 2].style.display;//判断左边单元格值是否已display 74 if (leftDisplay == 'none'){ 75 addf(); 76 }else{ 77 mergef(); 78 } 79 } else{ 80 addf(); 81 } 82 } else{ 83 mergef(); 84 } 85 } 86 } 87 }); 88 };