一、效果图

二、在html的head中引入jQuery

<script language="javascript" src="${pageContext.request.contextPath}/js/jquery-1.9.0.min.js"></script>

三、添加合并单元格的函数

      //函数说明:合并指定表格(表格id为_w_table_id)指定列(列数为_w_table_colnum)的相同文本的相邻单元格
//参数说明:_w_table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data
//参数说明:_w_table_colnum 为需要合并单元格的所在列。为数字,从最左边第一列为1开始算起。
function _w_table_rowspan(_w_table_id,_w_table_colnum){
_w_table_firsttd = "";
_w_table_currenttd = "";
_w_table_SpanNum = 0;
_w_table_Obj = $(_w_table_id + " tr td:nth-child(" + _w_table_colnum + ")");
_w_table_Obj.each(function(i){
if(i==0){
_w_table_firsttd = $(this);
_w_table_SpanNum = 1;
}else{
_w_table_currenttd = $(this);
if(_w_table_firsttd.text()==_w_table_currenttd.text()){
_w_table_SpanNum++;
_w_table_currenttd.hide(); //remove();
_w_table_firsttd.attr("rowSpan",_w_table_SpanNum);
}else{
_w_table_firsttd = $(this);
_w_table_SpanNum = 1;
}
}
});
}
//函数说明:合并指定表格(表格id为_w_table_id)指定行(行数为_w_table_rownum)的相同文本的相邻单元格
//参数说明:_w_table_id 为需要进行合并单元格的表格id。如在HTMl中指定表格 id="data" ,此参数应为 #data
//参数说明:_w_table_rownum 为需要合并单元格的所在行。其参数形式请参考jQuery中nth-child的参数。
// 如果为数字,则从最左边第一行为1开始算起。
// "even" 表示偶数行
// "odd" 表示奇数行
// "3n+1" 表示的行数为1、4、7、10.......
//参数说明:_w_table_maxcolnum 为指定行中单元格对应的最大列数,列数大于这个数值的单元格将不进行比较合并。
// 此参数可以为空,为空则指定行的所有单元格要进行比较合并。
function _w_table_colspan(_w_table_id,_w_table_rownum,_w_table_maxcolnum){
if(_w_table_maxcolnum == void 0){_w_table_maxcolnum=0;}
_w_table_firsttd = "";
_w_table_currenttd = "";
_w_table_SpanNum = 0;
$(_w_table_id + " tr:nth-child(" + _w_table_rownum + ")").each(function(i){
_w_table_Obj = $(this).children();
_w_table_Obj.each(function(i){
if(i==0){
_w_table_firsttd = $(this);
_w_table_SpanNum = 1;
}else if((_w_table_maxcolnum>0)&&(i>_w_table_maxcolnum)){
return "";
}else{
_w_table_currenttd = $(this);
if(_w_table_firsttd.text()==_w_table_currenttd.text()){
_w_table_SpanNum++;
_w_table_currenttd.hide(); //remove();
_w_table_firsttd.attr("colSpan",_w_table_SpanNum);
}else{
_w_table_firsttd = $(this);
_w_table_SpanNum = 1;
}
}
});
});
}

四、在head<script>中调用合并函数合并单元格

$(document).ready(function(){
_w_table_rowspan("#campusTable",2);
_w_table_rowspan("#campusTable",1);
});

参考链接:https://www.cnblogs.com/ly5201314/archive/2009/08/13/1545116.html

最新文章

  1. Ubuntu 14.04 无线网卡驱动安装
  2. 利用Babel来转化你的ES2015脚本初步
  3. django中间件
  4. phonegap 3.3教程 地理信息api教程
  5. Enum:Backward Digit Sums(POJ 3187)
  6. bat 脚本传递参数测试
  7. Entity Framework学习(一)
  8. Spring Aop重要概念介绍及应用实例结合分析
  9. POJ 3311 Hie with the Pie(状压DP + Floyd)
  10. JS生成 UUID的方法
  11. JS 单线程和事件循环
  12. float clearfix
  13. None.js 第六步 Stream(流)
  14. 54. Spiral Matrix以螺旋顺序输出数组
  15. 用rand()和srand()产生伪随机数的方法总结 【转】
  16. syslog-ng应用详解
  17. docker构建tomcat镜像
  18. Spring quartz Job不能依赖注入,Spring整合quartz Job任务不能注入
  19. Java中 static、final和static final的特点及区别
  20. Archlive新年第一棒: 基于2.6.37稳定内核的archlive20110107

热门文章

  1. WITH RECOMPILE和OPTION(RECOMPILE)区别仅仅是存储过程级重编译和SQL语句级重编译吗
  2. 解决C#中调用WCF方法报错:远程服务器返回错误 (404) 未找到
  3. 牛客JS编程大题(二)
  4. 抽取JDBC工具类并增删改查
  5. [Swift]LaunchScreen.storyboard设置启动页
  6. Swift5 语言指南(十六) 初始化
  7. 修改hosts文件用来观看coursera视频
  8. Could not load file or assembly Microsoft.SqlServer.management.sdk.sfc version 11.0.0.0
  9. Linux - 结合正则表达式使用grep命令
  10. LeetCode--No.002 Add Two Numbers