layui合并table相同内的行
<table border="1" id="table1" class="layui-table">
<thead>
<tr>
<th><b>姓名</b></th>
<th><b>项目</b></th>
<th><b>任务</b></th>
<th><b>日报</b></th>
<th><b>备注</b></th>
</tr>
</thead>
<tbody id="tbody">
@{
if (ViewBag.List != null && ViewBag.List.Count > 0)
{
for (int i = 0; i < ViewBag.List.Count; i++)
{
<tr>
<td>@ViewBag.List[i].Username</td>
<td>@ViewBag.List[i].ProjectName</td>
<td>@ViewBag.List[i].TaskName</td>
<td>@ViewBag.List[i].Daily</td>
<td>@ViewBag.List[i].Remark</td>
</tr>
}
}
}
</tbody>
</table>
<script>
//合并table的相同内容行
jQuery.fn.rowspan = function (colIdx) {
return this.each(function () {
var that;
$('tr', this).each(function (row) {
$('td:eq(' + colIdx + ')', this).filter(':visible').each(function (col) {
if (that != null && $(this).html() == $(that).html()) {
rowspan = $(that).attr("rowSpan");
if (rowspan == undefined) {
$(that).attr("rowSpan", 1);
rowspan = $(that).attr("rowSpan");
}
rowspan = Number(rowspan) + 1;
$(that).attr("rowSpan", rowspan);
$(this).hide();
} else {
that = this;
}
});
});
});
}
//调用
$(function () {
$("#table1").rowspan(0);//合并第1列
$("#table1").rowspan(1);//合并第2列
$("#table1").rowspan(2);//合并第3列
});
</script>
效果如图: