CSDN首页 空间 新闻 论坛 Blog 下载 读书 网摘 搜索 .NET Java 视频 接项目 求职 在线学习 买书 程序员 通知
不看会后悔的Windows XP之经验谈 简单快捷DIY实用家庭影院
CSDN社区
搜索 收藏 打印 关闭
CSDN社区 >  Web 开发 >  JavaScript

<**--如何用JavaScript去合并table中某些单元格??--**>

楼主leolee(历历)2002-04-18 09:10:29 在 Web 开发 / JavaScript 提问

因为合并是根据随机数据进行的,没有固定格式,只能根据数据值去考虑,js里面如何对table的单元格进行合并呢? 问题点数:200、回复次数:4Top

1 楼karma(无为MS MVP)回复于 2002-04-18 09:31:46 得分 100

try   something   like   this:  
   
  <table   id="tbl"   border="1"   cellpadding="0"   cellspacing="0">  
  <tr><td>hello</td><td>world</td>><td>hello</td><td>world</td></tr>  
  <tr><td>hello</td><td><b>china</b></td><td>hello</td><td>china</td></tr>  
  </table>  
  <input   type="button"   value="merge   2nd   row,   1,2,3   cells"   onclick="merge(1,0,2)">  
  <script   language="javascript">  
  function   merge(nRow,   nColStart,   nColEnd)  
  {  
      var   rows   =   tbl.rows;  
      if   (nRow   <   0   ||   nRow   >=   rows.length)  
  return;  
   
      var   cells   =   rows[nRow].cells;  
      if   (nColStart   <   0   ||   nColStart   >=   cells.length   ||   nColEnd   <   0   ||   nColEnd   >=   cells.length   ||  
  nColStart   >   nColEnd)  
  return;  
   
        var   s=   "";  
        for   (var   i=nColStart;   i   <=nColEnd;   i++)  
  s   +=   cells[i].innerHTML   +   "   ";  
   
        for   (var   i=nColStart;   i   <nColEnd;   i++)  
  rows[nRow].deleteCell(nColStart);  
   
        rows[nRow].cells[nColStart].colSpan   =   nColEnd   -   nColStart   +   1;  
        rows[nRow].cells[nColStart].innerHTML   =   s;  
  }  
  </script>Top

2 楼8988(晓月)回复于 2002-04-18 11:29:08 得分 90

<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>  
  </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>      
  Top

3 楼runmin()回复于 2002-04-18 13:15:31 得分 10

找到相应的单元格,设置colspan或者rowspan属性,然后删去多余的单元格Top

4 楼leolee(历历)回复于 2002-04-18 14:03:02 得分 0

谢谢~~~~  
  Top

相关问题

  • 合并单元格
  • 关于合并table中的任意单元格的问题
  • 怎样合并单元格?
  • listctrl合并单元格
  • 在脚本中取table单元格的值(javascript)?
  • 为什么在aspx页面中合并Table的单元格后不能把Button控件居中对齐在合并后的单元格内?
  • StringGrid的单元格能合并么
  • 如何合并Excel单元格(急)
  • flexgrid中单元格合并问题
  • EHLIB中单元格合并的问题

关键词

  • 数据
  • 单元格
  • china
  • 合并
  • hello
  • world

得分解答快速导航

  • 帖主:leolee
  • karma
  • 8988
  • runmin

相关链接

  • Web开发类图书

广告也精彩

反馈

请通过下述方式给我们反馈
反馈
提问
网站简介|广告服务|VIP资费标准|银行汇款帐号|网站地图|帮助|联系方式|诚聘英才|English|问题报告
北京创新乐知广告有限公司 版权所有, 京 ICP 证 070598 号
世纪乐知(北京)网络技术有限公司 提供技术支持
Copyright © 2000-2008, CSDN.NET, All Rights Reserved
GongshangLogo