合并单元格
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档 </title>
</head>
<body>
<table width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666" id="tab">
<tr bgcolor="#FFFFFF">
<td>张三 </td>
<td>男</td>
<td>21</td>
<td>数学 </td>
<td>90 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td>张三 </td>
<td>男</td>
<td>21</td>
<td>语文 </td>
<td>70 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td>张三 </td>
<td>男</td>
<td>21</td>
<td>英语 </td>
<td>60 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td>张三 </td>
<td>男</td>
<td>21</td>
<td>英语 </td>
<td>60 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td>张三 </td>
<td>男</td>
<td>21</td>
<td>英语 </td>
<td>60 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td>李四 </td>
<td>女</td>
<td>21</td>
<td>数学 </td>
<td>60 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td>李四 </td>
<td>女</td>
<td>21</td>
<td>语文 </td>
<td>60 </td>
</tr>
<tr bgcolor="#FFFFFF">
<td>王五 </td>
<td>男</td>
<td>21</td>
<td>英语 </td>
<td>60 </td>
</tr>
</table>
<script >
var tab=document.getElementById("tab");
mergeTable(tab,0) ;
/**
*合并单元格
*tab 表格
*mergeCellID 需要合并的单元格，第一列为0
*/
function mergeTable(tab,mergeCellID)
{
var name="";
for(var i=0,j=0;i<tab.rows.length;i++,j++) {
if(name==tab.rows[i].cells[mergeCellID].innerHTML) {
tab.rows[i].deleteCell(mergeCellID)
} else {
name=tab.rows[i].cells[mergeCellID].innerHTML;
if(i>0)
{
tab.rows[i-j].cells[mergeCellID].rowSpan=j;
}
j=0;
}
}
}
//参考 http://bbs.csdn.net/topics/300105407
</script >
</body>
</html>
//参考 http://bbs.csdn.net/topics/300105407
- 大小: 23.2 KB
分享到：
相关推荐
jsp合并单元格
JSP页面实现合并单元格，在js中写入，jsp中可以调用此js。
JSP Table 单元格合并 javascript
JSP动态合并单元格，利用JSTL的C标签实现.有效果图。很简单，有注释！
JSP页面中利用C标签动态合并单元格，这是我在开发中写的，并且用了两种方法来实现，保证能使用，有截图为证
本文通过实例代码给大家详细介绍了jsp动态合并单元格的方法，代码简单易懂，非常不错，需要的朋友参考下吧
在jsp、html页面中实现table表格按列合并相同数据行单元格代码，可实现功能为：在一个table表格中，合并指定列中所有相同数据相邻行单元格内容。
LayUiTable表单相同参数的单元格合并，可以几个列一起合并，注释相应完善。LayUiTable表单相同参数的单元格合并
Table相同行的单元格自动合并，使用js来实现此效果，具体代码下，感兴趣的朋友可以参考下
Thymeleaf是一个很好用的模板引擎, 可以完全取代JSP 需求 数据库中有张名为commanders的表存有多个人的信息, 现在通过后台去查询整张表, 返回一个集合, 要求使用thymeleaf动态的把集合内容以表格的形式展示在网页上 ...
这是一个课程表 用到了 居中 合并单元格 图片 音乐 可以自己添加
Grid++Report 可用于开发桌面C/S报表与WEB...实现动态报表、多层表头报表、分组单元格合并报表、分栏报表、票据打印、交叉表及各种格式报表都非常简便。安装程序中提供了每种软件开发工具下的丰富例程与详尽的帮助。
前端：Vue/JSP/React/HTML+JS+CSS/ASP 后台框架代码：java/c/c++/php/VB/lun/Andorid/Python 开发环境：idea 数据库：MySql（建议用 5.7，8.0 有时候会有坑） 部署环境：Tomcat（建议用 7.x 或者 8.x b版本），maven
前端：Vue/JSP/React/HTML+JS+CSS/ASP 后台框架代码：java/c/c++/php/VB/lun/Andorid/Python 开发环境：idea 数据库：MySql（建议用 5.7，8.0 有时候会有坑） 部署环境：Tomcat（建议用 7.x 或者 8.x b版本），maven
10、特有的分组单元格合并功能，轻松实现常见的中国式报表分组在列中展现并垂直居中要求。 11、全中文界面，针对中国式报表进行了很多专门实现，如：表格报表、财务金额线、大写金额、发票圈叉图标、负数红字、多层...
从Excel中读取数据导入到数据库中，Excel中有合并单元格的列，也有超过4000字符的数据列。
2、单元格：拖拽，下拉填充，多选区，查找和替换，定位，合并单元格，数据验证 3、行和列操作：隐藏、插入、删除行或列，冻结，文本分列 4、操作体验：撤销、重做，复制、粘贴、剪切，快捷键，格式刷，选区拖拽 5、...
可用以访问多种数据源，过滤和格式化数据，并能动态生成并传送真实的Excel文件（不仅仅是格式化静态数据），并带有各种公式，图表，略图，合并单元格，多种工作表单以及许多其它的格式选项。 组件列表 技术...
http://blog.csdn.net/tianxiawudi0720/article/details/47401399