layui 合并单元格

var layuiRowspan = function(fieldNameTmp, index, flag) {
   let fieldName = [];
   if (typeof fieldNameTmp == "string") {
      fieldName.push(fieldNameTmp);
   } else {
      fieldName = fieldName.concat(fieldNameTmp);
   }
   for (let i = 0; i < fieldName.length; i++) {
      execRowspan(fieldName[i], index, flag);
   }
}

var execRowspan = function(fieldName, index, flag) {
   // 1为不冻结的情况，左侧列为冻结的情况
   let fixedNode = index == "1" ? $(".layui-table-body")[index - 1] : (index == "3" ? $(".layui-table-fixed-r") : $(
      ".layui-table-fixed-l"));
   // 左侧导航栏不冻结的情况
   let child = $(fixedNode).find("td");
   let childFilterArr = [];
   // 获取data-field属性为fieldName的td
   for (let i = 0; i < child.length; i++) {
      if (child[i].getAttribute("data-field") == fieldName) {
         childFilterArr.push(child[i]);
      }
   }
   // 获取td的个数和种类
   let childFilterTextObj = {};
   for (let i = 0; i < childFilterArr.length; i++) {
      let childText = flag ? childFilterArr[i].innerHTML : childFilterArr[i].textContent;
      if (childFilterTextObj[childText] == undefined) {
         childFilterTextObj[childText] = 1;
      } else {
         let num = childFilterTextObj[childText];
         childFilterTextObj[childText] = num * 1 + 1;
      }
   }
   let canRowspan = true;
   let maxNum; //以前列单元格为基础获取的最大合并数
   let finalNextIndex; //获取其下第一个不合并单元格的index
   let finalNextKey; //获取其下第一个不合并单元格的值
   for (let i = 0; i < childFilterArr.length; i++) {
      (maxNum > 9000 || !maxNum) && (maxNum = $(childFilterArr[i]).prev().attr("rowspan") && fieldName != "8" ? $(
         childFilterArr[i]).prev().attr("rowspan") : 9999);
      let key = flag ? childFilterArr[i].innerHTML : childFilterArr[i].textContent; //获取下一个单元格的值
      let nextIndex = i + 1;
      let tdNum = childFilterTextObj[key];
      let curNum = maxNum < tdNum ? maxNum : tdNum;
      if (canRowspan) {
         for (let j = 1; j <= curNum && (i + j < childFilterArr.length);) { //循环获取最终合并数及finalNext的index和key
            finalNextKey = flag ? childFilterArr[i + j].innerHTML : childFilterArr[i + j].textContent;
            finalNextIndex = i + j;
            if ((key != finalNextKey && curNum > 1) || maxNum == j) {
               canRowspan = true;
               curNum = j;
               break;
            }
            j++;
            if ((i + j) == childFilterArr.length) {
               finalNextKey = undefined;
               finalNextIndex = i + j;
               break;
            }
         }
         childFilterArr[i].setAttribute("rowspan", curNum);
         if ($(childFilterArr[i]).find("div.rowspan").length > 0) { //设置td内的div.rowspan高度适应合并后的高度
            $(childFilterArr[i]).find("div.rowspan").parent("div.layui-table-cell").addClass("rowspanParent");
            $(childFilterArr[i]).find("div.layui-table-cell")[0].style.height = curNum * 38 - 10 + "px";
         }
         canRowspan = false;
      } else {
         childFilterArr[i].style.display = "none";
      }
      if (--childFilterTextObj[key] == 0 | --maxNum == 0 | --curNum == 0 | (finalNextKey != undefined && nextIndex ==
            finalNextIndex)) { //||(finalNextKey!=undefined&&key!=finalNextKey)
         canRowspan = true;
      }
   }
}

/*
   fieldName:用于定位相同的数据有多少行 
   elementId:要操作的table元素
   data-field
*/
function mergeCheckbox(fieldName, elementId) {
   var elementIndexList = new Array();

   //循环整个列表,创建每行数据的对象,并加入集合
   $.each($(elementId + ' .layui-table-body.layui-table-main .layui-table tbody tr'), function(i, obj) {
      /* 创建每行数据的对象 */
      var elementIndexObj = {
         "fieldName": "",
         "index": 0
      };
      /* 当前行字段的内容 */
      var fieldContent = $(obj).find("td[data-field=" + fieldName + "]").text().toString();
      
      /* 判断如果数组中没有存储任何行对象，则新增 */
      if (elementIndexList.length <= 0) {
         elementIndexObj["fieldName"] = $(obj).find("td[data-field=" + fieldName + "]").text().toString();
         /* 字段出现的次数 */
         elementIndexObj["index"]=$(this).index();
         elementIndexObj["ishave"]=true;
         /* 将对象加入集合 */
         elementIndexList.push(elementIndexObj);
      } else {
         //true 代表已存在 false 代表不存在
         var flag = false;
         var index; 
         for (var j = 0; j < elementIndexList.length; j++) {
            if(elementIndexList[j].fieldName == fieldContent){
               flag = true;
               index = j;
               break;
            }
         }
         
         if(flag){
            elementIndexObj["fieldName"] = $(obj).find("td[data-field=" + fieldName + "]").text().toString();
            /* 字段出现的次数 */
            elementIndexObj["index"]=$(this).index();
            elementIndexObj["ishave"]=false;
            /* 将对象加入集合 */
            elementIndexList.push(elementIndexObj);
         }else{
            elementIndexObj["fieldName"] = $(obj).find("td[data-field=" + fieldName + "]").text().toString();
            /* 字段出现的次数 */
            elementIndexObj["index"]=$(this).index();
            elementIndexObj["ishave"]=true;
            /* 将对象加入集合 */
            elementIndexList.push(elementIndexObj);
         }
      }
   });
   
   /* 改变每行的样式 */
   for(var g=0;g<elementIndexList.length;g++){
      /* 如果为true 则新增rowspan属性 */
      if(elementIndexList[g].ishave){
         var fieldValue = $(elementId + ' .layui-table-body.layui-table-main .layui-table tbody tr:eq('+elementIndexList[g].index+')').find("td:eq(0)").attr("rowspan","2");
      }else{
         var fieldValue = $(elementId + ' .layui-table-body.layui-table-main .layui-table tbody tr:eq('+elementIndexList[g].index+')').find("td:eq(0)").css("display","none");
      }
   }
}

来源：CSDN

作者：执丶笔

链接：https://blog.csdn.net/qq_36259025/article/details/104613881