采用新的方法解决extjs4.1 grid合并单元格问题.docxVIP

/kunoy/article/details/7829395采用新的方法解决extjs4.1 grid合并单元格问题 首先技术原理基于狂人论坛的大大yunfengcheng发的帖子《100行代码解决ExtJs4.1合并单元格问题》，表示感谢。如果需要他的代码各位可自行下载，在此不方便贴出（人家可卖30个金钱的呢，虽然有点小贵，呵呵）。好了，进入正题吧。首先使用他的代码后效果如下：从这幅图可以看出，该合并的都合并了，不该合并的也合并了，第三列“A单元”，属于不同的地块，不同栋数，常理是不应该合并的，所以引出一个问题，合并列时应该判断前一列的合并情况，属于不同合并区的单元格虽然值相等但不进行合并。效果应该是这样：这是优化后的代码效果，下面说说具体方法：如果你看了《100行代码解决ExtJs4.1合并单元格问题》的代码会发现，其中写了很多each语句，而且是嵌套的，在实现上图效果时，已经明显感觉速度有点慢，所以笔者就奇怪搞这么多each干嘛呢？直接用数组多好，参数已经指定合并的列了，用数组直接取不就得啦。代码如下：[javascript] /kunoy/article/details/7829395view plain/kunoy/article/details/7829395copy/kunoy/article/details/7829395print/kunoy/article/details/7829395?/**??*?Kunoy??*?合并单元格??*?@param?{}?grid??要合并单元格的grid对象??*?@param?{}?cols??要合并哪几列?[1,2,4]??*/??var?mergeCells?=?function(grid,cols){???var?arrayTr=document.getElementById(grid.getId()+-body).firstChild.firstChild.firstChild.getElementsByTagName(tr);?var?trCount?=?arrayTr.length;???var?arrayTd;???var?td;???var?merge?=?function(rowspanObj,removeObjs){?//定义合并函数??if(rowspanObj.rowspan?!=?1){???arrayTd?=arrayTr[rowspanObj.tr].getElementsByTagName(td);?//合并行??td=arrayTd[rowspanObj.td-1];???td.rowSpan=rowspanObj.rowspan;???td.vAlign=middle;?Ext.each(removeObjs,function(obj){?//隐身被合并的单元格??arrayTd?=arrayTr[obj.tr].getElementsByTagName(td);???arrayTd[obj.td-1].style.display=none;?});???}?};?var?rowspanObj?=?{};?//要进行跨列操作的td对象{tr:1,td:2,rowspan:5}?var?removeObjs?=?[];?//要进行删除的td对象[{tr:2,td:2},{tr:3,td:2}]?var?col;???Ext.each(cols,function(colIndex){?//逐列去操作tr?var?rowspan?=?1;???var?divHtml?=?null;//单元格内的数值??for(var?i=1;itrCount;i++){??//i=0表示表头等没用的行??arrayTd?=?arrayTr[i].getElementsByTagName(td);???var?cold=0;??//??????????Ext.each(arrayTd,function(Td){?//获取RowNumber列和check列?//??????????????if(Td.getAttribute(class).indexOf(x-grid-cell-special)?!=?-1)//??????????????????cold++;//??????????});?col=colIndex+cold;//跳过RowNumber列和check列??if(!divHtml){???divHtml?=?arrayTd[col-1].innerHTML;???rowspanObj?=?{tr:i,td:col,rowspan:rowspan}???}else{???var?cellText?=?arrayTd[col-1].innerHT