标签:
做报表,查询的时候,经常用到表格。
页面展示多条数据时,时常表格的第一列都是相同的,所以合并单元格,让表格看起来更直观。
写这个函数,其它js里面直接调用unionTab (tb,collength);其中第一个参数tb为表格ID,第二个参数为你想要进行单元格合并的表格列数。
缺点:只能实现前N列,不能实现某一列实现合并。
/**/ window.unionTab = function (tb, colLength) { var id = tb; tb = $("#" + tb).get(0); // 检查表格是否规整 if (!checkTab(tb)) { return; } var i = 0; var j = 0; var l = 0; var rowCount = tb.rows.length; // 行数 var colCount = tb.rows[0].cells.length; // 列数 var obj1 = null; var obj2 = null; var objtemp1 = []; var objtemp2 = []; //为每个单元格命名,表头不命名 for (i = 1; i < rowCount; i++) { for (j = 0; j < colCount; j++) { tb.rows[i].cells[j].id = id + "tb_" + i.toString() + "_" + j.toString(); } } var k = colLength - 1; //从后往前检查,进行逐列检查合并,开始列为colLength-1 for (i = k; i >= 0; i--) { //当i>0时有前方的单元格 if (i > 0) { //查找当前单元格前几单元格,l为列值 for (l = 0; l < i; l++) { objtemp1[l] = document.getElementById(id + "tb_1_" + l.toString()); //alert("单元格objtemp1,1_" + l.toString() + ",内容:" + objtemp1[l].innerText); } } obj1 = document.getElementById(id + "tb_1_" + i.toString()); for (j = 2; j < rowCount; j++) { if (i > 0) { //查找当前单元格前几单元格,l为列值 for (l = 0; l < i; l++) { objtemp2[l] = document.getElementById(id + "tb_" + j.toString() + "_" + l.toString()); } } obj2 = document.getElementById(id + "tb_" + j.toString() + "_" + i.toString()); if (obj1.innerText === obj2.innerText) { if (i > 0) { if (checkArray(objtemp1, objtemp2)) { obj1.rowSpan++; obj2.parentNode.removeChild(obj2); } else { obj1 = document.getElementById(id + "tb_" + j.toString() + "_" + i.toString()); for (l = 0; l < i; l++) { objtemp1[l] = document.getElementById(id + "tb_" + j.toString() + "_" + l.toString()); } } } else { obj1.rowSpan++; obj2.parentNode.removeChild(obj2); } } else { obj1 = document.getElementById(id + "tb_" + j.toString() + "_" + i.toString()); } } } }; ///////////////////////////////////////// // 功能:检查表格是否规整 // 参数:tb--需要检查的表格ID // /////////////////////////////////////// window.checkTab = function (tb) { if (tb.rows.length === 0) { return false; } //如果只有一行表头也返回false if (tb.rows.length === 1) { return false; } if (tb.rows[0].cells.length === 0) { return false; } for (var i = 0; i < tb.rows.length; i++) { if (tb.rows[0].cells.length !== tb.rows[i].cells.length) { return false; } } return true; }; //检查取出的值是否相等 window.checkArray = function (arr1, arr2) { for (var i = 0; i < arr1.length; i++) { if (arr1[i].innerText === arr2[i].innerText) { } else { return false; } } return true; };
标签:
原文地址:http://www.cnblogs.com/meggie523/p/5210728.html