JS合并单元格、JavaScript单元格合并

最新推荐文章于 2022-04-15 16:21:35 发布

qinglang1987

最新推荐文章于 2022-04-15 16:21:35 发布

阅读量3.2k

点赞数 1

分类专栏： JavaScript 文章标签： javascript table function button null border

本文链接：https://blog.csdn.net/wangxw8746/article/details/6953836

版权

JavaScript 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>合并表格</title>
<script>
///
//功能：合并表格
//参数：tb－需要合并的表格ID
//参数：colLength－－需要对前几列进行合并，比如，
//想合并前两列，后面的数据列忽略合并，colLength应为2
//缺省表示对全部列合并
//data:2011.11.06
///
function uniteTable(tb,colLength){
//检查表格是否规整
if(!checkTable(tb)) return;
  var i=0;
  var j=0;
  var rowCount=tb.rows.length; //行数
  var colCount=tb.rows[0].cells.length; //列数
  var obj1=null;
  var obj2=null;
  //为每个单元格命名
  for(i=0;i<rowCount;i++){
    for(j=0;j<colCount;j++){
      tb.rows[i].cells[j].id="tb__" + i.toString() + "_" + j.toString();
    }
  }
  //逐列检查合并
  for(i=0;i<colCount;i++){
    if(i==colLength) return;
    obj1=document.getElementById("tb__0_"+i.toString())
    for(j=1;j<rowCount;j++){
      obj2=document.getElementById("tb__"+j.toString()+"_"+i.toString());
      if(obj1.innerText==obj2.innerText){
          obj1.rowSpan++;
          obj2.parentNode.removeChild(obj2);
      }else{
        obj1=document.getElementById("tb__"+j.toString()+"_"+i.toString());
      }
    }
    }
}

/
//功能：检查表格是否规整
//参数：tb－－需要检查的表格ID
//data: 2011.11.06
/
function checkTable(tb){
  if(tb.rows.length==0) return false;
    if(tb.rows[0].cells.length==0) return false;
  for(var i=0;i<tb.rows.length;i++){
      if(tb.rows[0].cells.length!=tb.rows[i].cells.length) return false;
  }
    return true;
}
</script>
</head>
<body>
<table width="400" border="1" id="table1">
      <tr>
          <td>a</td>
          <td>for</td>
          <td>100</td>
          <td>200</td>
          <td>1</td>
      </tr>
      <tr>
          <td>a</td>
          <td>for</td>
          <td>100</td>
          <td>300</td>
          <td>2</td>
      </tr>
      <tr>
          <td>a</td>
          <td>if</td>
          <td>100</td>
          <td>200</td>
          <td>3</td>
      </tr>
      <tr>
          <td>a</td>
          <td>if</td>
          <td>300</td>
          <td>230</td>
          <td>4</td>
      </tr>
      <tr>
          <td>a</td>
          <td>if</td>
          <td>320</td>
          <td>230</td>
          <td>5</td>
      </tr>
</table>
<br><input type="button" value="合并表格" onClick="uniteTable(table1,4)">
</body>
</html>

qinglang1987

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
JS合并单元格、JavaScript单元格合并

合并表格 /////////////////////////////////////////////// //功能：合并表格 //参数：tb－需要合并的表格ID //参数：colLength－－需要对前几列进行合并，比如， //想合并前两列，后面的数据列忽略合并，colLength应为2 //缺省表示对全部列合并
复制链接

扫一扫

专栏目录