实现表格的分组效果
谁能帮我实现下,网上的单元格合并那些不满足这个需求,如果写好了 ,分全部奉送!!
你看看mergeCell('tab1',0);
mergeCell('tab1',1);
自己看看为什么第二列没有合并??
是我的调用方式有问题?
mergeCell('tab1',0);
mergeCell('tab1',1);
mergeCell('tab1',2);
还是倒过来
mergeCell('tab1',2);
mergeCell('tab1',1);
mergeCell('tab1',0);
纯粹是不求甚解,没看我的需求!
从网上DOWN的代码吧,汗 你其它地方有看到过?我赶着下班前帮你写出来容易麻我
我只写个例子提出思路
好吧还是按你要求改了下
<table id="tab1" width="200" border="1" >
<tr>
<td >a</td>
<td>x1</td>
<td>1</td>
</tr>
<tr>
<td>a</td>
<td>x1</td>
<td>2</td>
</tr>
<tr>
<td>a</td>
<td>x2</td>
<td>1</td>
</tr>
<tr>
<td>b</td>
<td>x3</td>
<td>1</td>
</tr>
<tr>
<td>c</td>
<td>x4</td>
<td>2</td>
</tr>
<tr>
<td>d</td>
<td>x5</td>
<td>2</td>
</tr>
</table>
<script>
//tabId:表ID
function mergeCell(tabId){
var tb=document.getElementById(tabId),rs=tb.rows,ac,acv;
if(!rs.length) return;
for(var i=0,L=rs[0].cells.length;i<L;i++){
for(var r=0;r<rs.length;r++){
var cs=rs[r].cells, c=cs[i];
if( !ac
[解决办法]
(c.innerHTML!=ac.innerHTML ) ){
ac=c;
}else{
if(getP(c) == getP(ac)){
ac.rowSpan=(ac.rowSpan
[解决办法]
0)+1;
c.isDel=true;
}
}
}
}
function getP(el){
while( (el=el.previousSibling) && (el.tagName!='TD') );
return el?el.innerHTML:'';
}
var tds=tb.getElementsByTagName('td'),i=tds.length;
while(i--)tds[i].isDel&&tds[i].parentNode.removeChild(tds[i]);
}
mergeCell('tab1');
</script>
[解决办法]
也不至于要说的那么刻薄吧?
在 #2 的基础上稍作调整不就可以了吗?
<table id="tab1" width="200" border="1" >
<tr><td >张三</td><td>东营</td><td>1087</td></tr>
<tr><td >张三</td><td>东营</td><td>1082</td></tr>
<tr><td >张三</td><td>新疆</td><td>1082</td></tr>
<tr><td >李文</td><td>西安</td><td>1082</td></tr>
<tr><td >高四</td><td>北京</td><td>1087</td></tr>
<tr><td >高四</td><td>济南</td><td>1087</td></tr>
</table>
<script>
function mergeCell(tabId) {
var rs=document.getElementById(tabId).rows,ac,acv;
for(var col=rs[0].cells.length-2; col>=0; col--) {
for(var r=0;r<rs.length;r++){
var c=rs[r].cells[col];
if(acv!=c.innerText){
acv=c.innerText
ac=c;
}else{
ac.rowSpan=(ac.rowSpan
[解决办法]
0)+1;
c.parentNode.removeChild(c);
}
}
}
}
mergeCell('tab1');
</script>

[解决办法]
晕死,9#又有错,不给个修改功能
<script type="text/javascript">
function mc(tableId, startRow, endRow, col) {
var tb = document.getElementById(tableId);
if (col >= tb.rows[0].cells.length) {
return;
}
if (col == 0) { endRow = tb.rows.length - 1; }
for (var i = startRow; i < endRow; i++) {
if (tb.rows[startRow].cells[col].innerHTML == tb.rows[i + 1].cells[0].innerHTML) {
tb.rows[i + 1].removeChild(tb.rows[i + 1].cells[0]);
tb.rows[startRow].cells[col].rowSpan = (tb.rows[startRow].cells[col].rowSpan
[解决办法]
0) + 1;
if (i == endRow - 1 && startRow != endRow) {
mc(tableId, startRow, endRow, col + 1);
}
} else {
mc(tableId, startRow, i + 0, col + 1);
startRow = i + 1;
}
}
}
mc('table1', 0, 0, 0);
</script>