karma(无为)，8988(晓月)，或知道的人请进：Table单元格合并出现奇怪的问题！！！

Question

把这个页的html都帖出来，我帮你调调。
我喜欢玩js================================================================CSDN 论坛助手 Ver 1.0 B0402提供下载。 改进了很多，功能完备！★  浏览帖子速度极快！[建议系统使用ie5.5以上]。 
★  多种帖子实现界面。 
★  保存帖子到本地[html格式]
★  监视您关注帖子的回复更新。
★  可以直接发贴、回复帖子
★  采用XML接口，可以一次性显示4页帖子,同时支持自定义每次显示帖子数量。
    可以浏览历史记录！ 
★  支持在线检测程序升级情况，可及时获得程序更新的信息。★★ 签名  ●  
     可以在您的每个帖子的后面自动加上一个自己设计的签名哟。Http://www.ChinaOK.net/csdn/csdn.zip
Http://www.ChinaOK.net/csdn/csdn.rar
本签名由 CSDN 论坛助手自动添加！

Answer 1

下面就是，可以复制下来，然后填一些行列值，会发现往下做合并会出现以为错位的现象：<table border="1" width="100%" id=tab1 onmousedown=tabStart() onmouseup=tabEnd()>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
</table>
<p>从第<input type="text" name="col1" size="4">列到第<input type="text" name="col2" size="4">列&nbsp;&nbsp;&nbsp;   
从第<input type="text" name="row1" size="4">行到第<input type="text" name="row2" size="4">行<input type="button" value="合并" onclick=doTab()></p>  
<script>  
function doTab(){  
    x1=col1.value-1;  
    x2=col2.value-1;  
    y1=row1.value-1;  
    y2=row2.value-1;  
    if (x1==x2 && y1==y2) return;  
    htmlstr="";  
    xspan=0;
    yspan=0;
    for (i=x1;i<=x2;i++) xspan+=tab1.rows[y1].cells[i].colSpan;
    for (i=y1;i<=y2;i++) yspan+=tab1.rows[i].cells[x1].rowSpan;
    
    for (i=y1;i<=y2;i++) { 
        htmlstr+="<br>"; 
         
        for(j=x1;j<=x2;j++){  
            htmlstr+=tab1.rows[i].cells[j].innerHTML;  
            
        }
    } 
    htmlstr=htmlstr.substr(4); 
    for (i=y1;i<=y2;i++){ 
        j=x1; 
        while (j<x2){ 
               tab1.rows[i].deleteCell(x1); 
               j++; 
        } 
        tab1.rows[i].cells[x1].colSpan=xspan;
    }
    for (i=y2;i>y1;i--){
        tab1.rows[i].deleteCell(x1);
    }
    tab1.rows[y1].cells[x1].rowSpan=yspan;
    tab1.rows[y1].cells[x1].innerHTML=htmlstr; 
    //alert(htmlstr);  
}  
function tabStart(){  
    obj=window.event.srcElement;  
    col1.value=obj.cellIndex+1;  
    col2.value=col1.value;  
    row1.value=obj.parentElement.rowIndex+1;  
    row2.value=row1.value;  
}  
function tabEnd(){  
    obj=window.event.srcElement;  
    col2.value=obj.cellIndex+1;  
    row2.value=obj.parentElement.rowIndex+1;  
}  
</script>

Answer 2

下面就是，你只要对单列进行合并，然后连续对几个单列做合并（不要几列合并），就会发现除了第一次合并正常，其余合并都会出现错位的现象，我知道是因为第一次合并造成表格不再是原来的矩形，那么这个问题该如何解决？(1,1,1,5);//第一列
(2,2,2,4);//第二列
(2,2,3,7);//第二列
(3,3,1,3);//第三列
如上填入这类数字（自己随便输）。<table border="1" width="100%" id=tab1 onmousedown=tabStart() onmouseup=tabEnd()>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">111</td>
    <td width="25%">111</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">222</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
  <tr>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
    <td width="25%">　</td>
  </tr>
</table>
<p>从第<input type="text" name="col1" size="4">列到第<input type="text" name="col2" size="4">列&nbsp;&nbsp;&nbsp;   
从第<input type="text" name="row1" size="4">行到第<input type="text" name="row2" size="4">行<input type="button" value="合并" onclick=doTab()></p>  
<script>  
function doTab(){  
    x1=col1.value-1;  
    x2=col2.value-1;  
    y1=row1.value-1;  
    y2=row2.value-1;  
    if (x1==x2 && y1==y2) return;  
    htmlstr="";  
    xspan=0;
    yspan=0;
    for (i=x1;i<=x2;i++) xspan+=tab1.rows[y1].cells[i].colSpan;
    for (i=y1;i<=y2;i++) yspan+=tab1.rows[i].cells[x1].rowSpan;
    
    for (i=y1;i<=y2;i++) { 
        htmlstr+="<br>"; 
         
        for(j=x1;j<=x2;j++){  
            htmlstr+=tab1.rows[i].cells[j].innerHTML;  
            
        }
    } 
    htmlstr=htmlstr.substr(4); 
    for (i=y1;i<=y2;i++){ 
        j=x1; 
        while (j<x2){ 
               tab1.rows[i].deleteCell(x1); 
               j++; 
        } 
        tab1.rows[i].cells[x1].colSpan=xspan;
    }
    for (i=y2;i>y1;i--){
        tab1.rows[i].deleteCell(x1);
    }
    tab1.rows[y1].cells[x1].rowSpan=yspan;
    tab1.rows[y1].cells[x1].innerHTML=htmlstr; 
    //alert(htmlstr);  
}  
function tabStart(){  
    obj=window.event.srcElement;  
    col1.value=obj.cellIndex+1;  
    col2.value=col1.value;  
    row1.value=obj.parentElement.rowIndex+1;  
    row2.value=row1.value;  
}  
function tabEnd(){  
    obj=window.event.srcElement;  
    col2.value=obj.cellIndex+1;  
    row2.value=obj.parentElement.rowIndex+1;  
}  
</script>

Answer 3

回复人： Lostinet(lostinet.d2g.com) (  ) 信誉：100  2002-04-19 12:31:00  得分:0  合并了第一次，有些区域不能再当矩形区域来看待了。 那如何对合并一次后剩下的区域进行再次合并呢？
 
 

Answer 4

最简单的解决方法是调用顺序倒过来
即
<script>
doTab(3,3,1,3);//第三列
doTab(2,2,4,7);//第二列
doTab(2,2,2,4);//第二列
doTab(1,1,1,5);//第一列
</script>

Answer 5

to :qiushuiwuhen(秋水无恨)
哈哈哈，我笑死了，你的方法很不错，反正后面的表格变形不影响前面的表格，还可以继续正常合并，很绝阿，这么轻松就解决我的问题了。
分数都送你。