首页 > web前端 > js教程 > 正文

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

高洛峰
发布: 2016-11-25 14:09:56
原创
1657人浏览过

<html>  

  <head>  

  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  

  <title>合并表格</title>  

  <script>  

立即学习Java免费学习笔记(深入)”;

  ///////////////////////////////////////////////  

  //功能:合并表格  

  //参数: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;  

单元格合并插件tablesMergeCell.js
单元格合并插件tablesMergeCell.js

单元格合并插件tablesMergeCell.js

单元格合并插件tablesMergeCell.js 37
查看详情 单元格合并插件tablesMergeCell.js

    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>   www.2cto.com

          <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>、

 

相关标签:
js
java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号