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

leolee 2002-04-19 11:37:26
function doTab(x1,x2,y1,y2){
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);
}
我使用了8988提供的合并代码，但是发现Table单元格合并出现了很奇怪的现象。
比如：
doTab(col1,col2,row1,row2);
我通常只对列的数据进行合并。
比如我做了以下动作：
doTab(1,1,1,5);//第一列
doTab(2,2,2,4);//第二列
doTab(2,2,3,7);//第二列
doTab(3,3,1,3);//第三列

除了第一个合并位置是正确的，其余接下来的合并的位置全是错位的。我打印了每一行的列数，发现合并一次以后，每一行的列数的都会发生变化，而且都不一定相同，不再是原来的的表格列数目，造成合并的单元格都错位到其他列上。
这个问题如何解决呢？？我不可能仅合并表格中的一列，肯定是要对多个列进行合并阿！
...全文
117 11 打赏 收藏 转发到动态 举报
写回复
用AI写文章
11 条回复
切换为时间正序
请发表友善的回复…
发表回复
Lostinet 2002-04-19
  • 打赏
  • 举报
 回复
合并了第一次，有些区域不能再当矩形区域来看待了。
8988 2002-04-19
  • 打赏
  • 举报
 回复
这问题解决起来，比较棘手。我正在研究fp中合并的处理方法。
Lostinet 2002-04-19
  • 打赏
  • 举报
 回复
..如果你是预先知道调用哪列的，那么还用这样么？
leolee 2002-04-19
  • 打赏
  • 举报
 回复
to :qiushuiwuhen(秋水无恨)
哈哈哈，我笑死了，你的方法很不错，反正后面的表格变形不影响前面的表格，还可以继续正常合并，很绝阿，这么轻松就解决我的问题了。
分数都送你。
qiushuiwuhen 2002-04-19
  • 打赏
  • 举报
 回复
最简单的解决方法是调用顺序倒过来
即
<script>
doTab(3,3,1,3);//第三列
doTab(2,2,4,7);//第二列
doTab(2,2,2,4);//第二列
doTab(1,1,1,5);//第一列
</script>
Lostinet 2002-04-19
  • 打赏
  • 举报
 回复
判断指定的坐标范围是否能合并啊。
不然出现的不是一个矩形格了。
算法方面，去找5指棋高手。。。
leolee 2002-04-19
  • 打赏
  • 举报
 回复
回复人： Lostinet(lostinet.d2g.com) ( ) 信誉：100 2002-04-19 12:31:00 得分:0

合并了第一次，有些区域不能再当矩形区域来看待了。

那如何对合并一次后剩下的区域进行再次合并呢？


leolee 2002-04-19
  • 打赏
  • 举报
 回复
下面就是，你只要对单列进行合并，然后连续对几个单列做合并（不要几列合并），就会发现除了第一次合并正常，其余合并都会出现错位的现象，我知道是因为第一次合并造成表格不再是原来的矩形，那么这个问题该如何解决？

(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">列   
从第<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>
leolee 2002-04-19
  • 打赏
  • 举报
 回复
下面就是，可以复制下来，然后填一些行列值，会发现往下做合并会出现以为错位的现象：

<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">列   
从第<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>
ChinaOk 2002-04-19
  • 打赏
  • 举报
 回复
把这个页的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 论坛助手自动添加！
leolee 2002-04-19
  • 打赏
  • 举报
 回复
所以想问问解决办法阿，楼上的
步步高侠客行电脑模拟器
步步高词典A系列侠客行电脑端模拟器，不会程序抛费 ，找了好才弄好的，不容易啊~！！！！！！！！！！！
npm ERR While resolving undefined@undefined npm ERR Found umi@3.3.9 npm ERR node_modulesumi np
$ npm i npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: undefined@undefined npm ERR! Found: umi@3.3.9 ... umi@"^3.3.7" from the root project ...
React风格的企业前端技术
React视频教程，本次分享将围绕如何打造react风格的前端项目展开，重点介绍当下流行的前端项目的工作流，react、angular等火热的前端框架，karma、Mocha等流行的前端单元测试框架，用户体验、性能优化等。
在使用npm install时遇到的问题 npm ERR code ERESOLVE
在使用npm install时遇到的问题 npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: ruoyi@3.4.0 npm ERR! Found: webpack@5.35.0 npm ERR! node_...
安装依赖时报错：npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving
然后npm intall即可，笔者习惯用yarn，它更快一点。原因是node版本太高，降低版本即可。npm run serve报错。输入如下代码，即可安装成功。
JavaScript

87,907

社区成员

224,614

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章