body
<table border="1px;" id="subtable">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td>2</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<td>2</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<td>3</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<td>4</td>
<td>8</td>
<td>9</td>
</tr>
</table>
我这里分了两种 一种是合并table下的所有td,另一种是合并指定的td
1.合并table下的所有td中相同的数据
$(function(){
var tab = document.getElementById("subtable");
var maxCol = 3, val, count, start;
var ys="";
for(var col = maxCol-1; col >= 0 ; col--) {
count = 1;
val = "";
for(var i=0; i<tab.rows.length; i++){
if(val == tab.rows[i].cells[col].innerHTML){
count++;
}else{
if(count > 1){
//合并
start = i - count;
if(ys=="#00FFFF"){
ys="#EEEE00";
}else{
ys="#00FFFF";
}
tab.rows[start].cells[col].rowSpan = count;
tab.rows[start].cells[1].style.backgroundColor=ys;//改变颜色
// ys="#EEEE00";
// tab.rows[i].cells[1].style.backgroundColor="#00FFFF";//改变颜色绿色
for(var j=start+1; j<i; j++){ //
tab.rows[j].cells[col].style.display = "none";
tab.rows[j].removeChild(tab.rows[j].cells[col]);
}
count = 1;
}
val = tab.rows[i].cells[col].innerHTML;
}
}
if(count > 1 ){ //合并,最后几行相同的情况下
start = i - count;
tab.rows[start].cells[col].rowSpan = count;
for(var j=start+1; j<i; j++) {
tab.rows[j].removeChild(tab.rows[j].cells[col]);
}
}
}
})
2.合并table下指定的td
jQuery.fn.rowspan = function(colIdx) { //封装的一个JQuery小插件
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() {
$("#subtable").rowspan(0);//传入的参数是对应的列数从0开始 第一列合并相同
// $("#subtable").rowspan(1);//传入的参数是对应的列数从0开始 第二列合并相同
});
备注 :要用到第二种的话必须引入Jq,我这里第一种用到了$(function(){}) 所以也要引入Jq 第一种去掉页面加载的话,就是纯js,所以不用引入Jq就行