jQuery表格相同列合并
原创
©著作权归作者所有:来自51CTO博客作者歆瑶的小房子的原创作品,请联系作者获取转载授权,否则将追究法律责任
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;
}
});
});
});
}
$(document).ready(function() {
$("#lookInfoTable").rowspan(0);
$("#lookInfoTable").rowspan(1);
});
<table id="lookInfoTable" border="1" cellspacing="0">
<thead>
<tr><th>年级</th>
<th>院系</th>
<th>班级</th>
<th>人数</th>
</tr></thead>
<tbody>
<tr>
<td>2016</td>
<td>计算机系</td>
<td>1班</td>
<td>50</td>
</tr>
<tr>
<td>2016</td>
<td>计算机系</td>
<td>2班</td>
<td>50</td>
</tr>
<tr>
<td>2016</td>
<td>计算机系</td>
<td>3班</td>
<td>50</td>
</tr>
<tr>
<td>2016</td>
<td>化学系</td>
<td>1班</td>
<td>50</td>
</tr>
<tr>
<td>2016</td>
<td>化学系</td>
<td>1班</td>
<td>50</td>
</tr>
</tbody>
</table>