table表格依据数据进行合并单元格
table表格依据数据内容相同时进行合并行单元格
合并前与合并后实际效果比较
原理
先循环列再循环行,对第一行和第二行进行内容比较,如果内容相同,就隐藏第二行,并将计数器sum+1。继续比较第二行与第三行,依次类推,本列循环完毕,给本列第一行添加rowspan=sum
此列完毕后进行下一列。
核心代码
$(function() {
merage()
function merage() {
let table = $('.table tbody')
let lenTr = table.children('tr').size()
let lenTd = table.children('tr').eq(0).children('td').size()
let sum = 1
let rowIndex = -1
// 列循环
for (let c = 0; c < lenTd; c++) {
// 行循环
for (let r = 0; r < lenTr - 1; r++) {
let td = table.children('tr').eq(r).children('td').eq(c)
let tdNext = table.children('tr').eq(r + 1).children('td').eq(c)
// 判断内容相同时
if (td.html() == tdNext.html()) {
if (rowIndex == -1) {
rowIndex = r
}
tdNext.addClass('hide')
sum++
// 内容不同时
} else {
rowIndex = -1
sum = 1
}
table.children('tr').eq(rowIndex).children('td').eq(c).attr('rowspan', sum)
}
rowIndex = -1
sum = 1
}
}
})
写代码犯错的位置
demo下载
[table表格依据数据内容相同时进行合并行单元格(https://download.csdn.net/download/weixin_42708208/12064024)
版权声明:本文为weixin_42708208原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。