javascript动态合并表格相同的单元格
<!DOCTYPE html>
<html lang="en"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档 </title>
</head> <body>
<table width="100%" border="1" cellspacing="0" cellpadding="0" id="tab">
<tr height="48">
<!--<td height="48" width="72">选择</td>-->
<!--<td width="72">积分表编号</td>-->
<td width="72">应用对象</td>
<td width="72">所属线条</td>
<td width="72">事件分类</td>
<td width="72">事件等次</td>
<td width="68">事件积分</td>
<td width="135">评分说明</td>
<td width="72">发文依据</td>
<td width="72">条款编号（非必填）</td>
<td width="40">备注</td>
</tr>
<tr height="50">
<!--<td height="50"> </td>-->
<!--<td>JF0001</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td>10</td>
<td width="135">(一) 在维护或客户服务过程中，擅自修改用户数据或局数据的行为，每次扣从业资格积分10分。</td>
<td width="72">xx分公司网运线维护外包从业人员积分管理规定</td>
<td width="72">xx分公司网运线维护外包从业人员积分管理规定分公司网运线维护外包从业人员积分管理规定<br />
第三条 、第七条</td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0002</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0003</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0004</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0005</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">黑名单记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0006</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">黑名单记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0007</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td> </td>
<td width="135"> </td>
<td width="72"> </td>
<td> </td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0008</td>-->
<td width="72">业务外包人员</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td> </td>
<td width="135"> </td>
<td width="72"> </td>
<td> </td>
<td> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0009</td>-->
<td width="72">业务外包人员</td>
<td width="72">网运线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td width="40"> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0010</td>-->
<td width="72">业务外包人员</td>
<td width="72">网运线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td width="40"> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0011</td>-->
<td width="72">业务外包人员</td>
<td width="72">网运线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td width="40"> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0012</td>-->
<td width="72">业务外包人员</td>
<td width="72">网运线</td>
<td>不良事件</td>
<td width="72">黑名单记录</td>
<td> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td width="40"> </td>
</tr>
<tr height="32">
<!--<td height="32"> </td>-->
<!--<td>JF0013</td>-->
<td width="72">业务外包人员</td>
<td width="72">网运线</td>
<td>不良事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td width="40"> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0014</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135">待定</td>
<td width="72"> </td>
<td width="72">待定</td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0015</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0016</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0017</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0018</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">黑名单记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0019</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0020</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0021</td>-->
<td width="72">业务外包商</td>
<td width="72">市场线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0022</td>-->
<td width="72">业务外包商</td>
<td width="72">网运线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135">待定</td>
<td width="72"> </td>
<td width="72">待定</td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0023</td>-->
<td width="72">业务外包商</td>
<td width="72">网运线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0024</td>-->
<td width="72">业务外包商</td>
<td width="72">网运线</td>
<td width="72">良好事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0025</td>-->
<td width="72">业务外包商</td>
<td width="72">网运线</td>
<td width="72">不良事件</td>
<td width="72">黑名单记录</td>
<td width="68"> </td>
<td width="135">待定</td>
<td width="72"> </td>
<td width="72">待定</td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0026</td>-->
<td width="72">业务外包商</td>
<td width="72">网运线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0027</td>-->
<td width="72">业务外包商</td>
<td width="72">网运线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
<tr height="18">
<!--<td height="18"> </td>-->
<!--<td>JF0028</td>-->
<td width="72">业务外包商</td>
<td width="72">网运线</td>
<td width="72">不良事件</td>
<td width="72">诚信记录</td>
<td width="68"> </td>
<td width="135"> </td>
<td width="72"> </td>
<td width="72"> </td>
<td> </td>
</tr>
</table> <script type="text/javascript">
window.onload = function () {
var tab = document.getElementById("tab");
//console.log(cells);
var maxCol = 2, val, count, start; // maxCol 为需要合并的列来为多少列，如3，那就是第1到第3列
// maxCol如果为1,那就是只合并第一列
// val 相同的列，
for (var col = maxCol - 1; col >= 0; col--) {
count = 1;
val = "";
for (var i = 0; i < tab.rows.length; i++) {
if (val == tab.rows[i].cells[col].innerHTML) {
console.log(tab.rows[i].cells[col]);
count++;
} else {
if (count > 1) { //合并
start = i - count;
tab.rows[start].cells[col].rowSpan = count;
for (var j = start + 1; j < i; j++) {
tab.rows[j].cells[col].style.display = "none";
}
count = 1;
}
val = tab.rows[i].cells[col].innerHTML;
}
//console.log(val); }
//console.log(count);
//console.log(start);
if (count > 1) { //合并，最后几行相同的情况下
start = i - count;
tab.rows[start].cells[col].rowSpan = count;
for (var j = start + 1; j < i; j++) {
tab.rows[j].cells[col].style.display = "none";
}
}
}
};
</script>
</body> </html>
转自：
https://www.cnblogs.com/ybixian/p/9207915.html
javascript动态合并表格相同的单元格的更多相关文章
- Javascript合并表格相同内容单元格示例
效果图: HTML代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http: ...
- JavaScript动态改变表格单元格内容的方法
本文实例讲述了JavaScript动态改变表格单元格内容的方法.分享给大家供大家参考.具体如下: JavaScript动态改变表格单元格的内容,下面的代码通过修改单元格的innerHTML来修改单元格 ...
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- FineUI大版本升级，外置ExtJS库、去AXD化、表格合计行、表格可编辑单元格的增删改、顶部菜单框架
这是一篇很长的文章,在开始正文之前,请允许我代表目前排名前 20 中唯一的 .Net 开源软件 FineUI 拉下选票: 投票地址: https://code.csdn.net/2013OSSurve ...
- 使用js合并table中的单元格
用primefaces做的报表,领导要求合并相同内容的单元格,但是primefaces没有找到可以合并单元格的组件,想来想去,只有页面加载后用js合并了. http://blog.csdn.net/d ...
- NX二次开发-UFUN工程图表格注释设置单元格首选项UF_TABNOT_set_cell_prefs
NX9+VS2012 #include <uf.h> #include <uf_tabnot.h> #include <NXOpen/Part.hxx> #incl ...
- Swift - 给表格添加移动单元格功能（拖动行）
1,下面的样例是给表格UITableView添加单元格移动功能: (1)给表格添加长按功能,长按后表格进入编辑状态 (2)在编辑状态下,可以看到单元格后面出现拖动按钮 (3)鼠标按住拖动按钮,可以 ...
- element 动态合并表格
前言 element 官方的例子太简单了,不满足实际的需求 数据肯定是动态的,合并的行数,列数都是动态的,该如何知道每一行的合并数呢 需求 动态合并表格,数据来源于数据库 正文 一开始,我的数据源是单 ...
- Spire.Cloud.SDK for Java 合并、拆分Excel单元格
Spire.Cloud.SDK for Java 是Spire.Cloud云产品系列中,用于处理Word.Excel.PowerPoint以及PDF文档的JAR文件,可执行文档编辑.转换.保存等操作. ...
随机推荐
- PHP被忽略的基础知识
目录 下列PHP配置项中,哪一个和安全最不相关:() 字符串比较函数 格林时间 在PHP面向对象中,下面关于final修饰符描述错误的是( ) getdate()函数返回的值的数据类型是:( ) 关于 ...
- Android持久化存储——（包含操作SQLite数据库）
<第一行代码>读书手札 你可能会遇到的问题:解决File Explorer 中无显示问题 Android中,持久化存储,常见的一共有三种方法实现 (一.)利用文件存储 文件存储是Andro ...
- Acuntetix的安装与使用
1.下载软件压缩包文件,首先点击"Acunetix.Web.12.0.180911134.Retail.exe"安装最新版原程序 2.阅读并同意软件安装协议 3.设置登录信息,包括 ...
- opencv模块学习
一.简介 ''' 分辨率(resolution,港台称之为解析度)就是屏幕图像的精密度,是指显示器所能显示的像素的多少.由于屏幕上的点.线和面都是由像素组成的,显示器可显示的像素越多,画面就越精细,同 ...
- Win32小游戏--贪吃蛇
近日里学习了关于win32编程的相关知识,利用这些知识制作了一款贪吃蛇小游戏,具体细节还是分模块来叙述 前期准备:在网上找到一些贪吃蛇的游戏素材图片,以及具体的逻辑框图 在正式写功能之前,先把一系列环 ...
- Shiro授权及注解式开发
目的: shiro授权 shiro注解式开发 Shiro授权 首先设计shiro权限表: 从图中我们也清晰的看出五张表之间的关系 ShiroUserMapper Set<String> g ...
- go开发 modules 的使用和代理
go开发 modules 的使用和代理 初学go语言,一堆 来自谷歌的包如 import ( "code.google.com/xxx" ) 不翻墙是很难下载下来的. 另外还有麻烦 ...
- 集合并卷积的三种求法(分治乘法，快速莫比乌斯变换(FMT)，快速沃尔什变换(FWT))
也许更好的阅读体验 本文主要内容是对武汉市第二中学吕凯风同学的论文<集合幂级数的性质与应用及其快速算法>的理解 定义 集合幂级数 为了更方便的研究集合的卷积,引入集合幂级数的概念 集合幂级 ...
- hdu 2616 暴力使用 dfs求最短路径（剪枝有点依稀）
Kill the monster Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) ...
- Java之协程（quasar）
一.前面我们简单的说了一下,Python中的协程原理.这里补充Java的协程实现过程.有需要可以查看python之协程. 二.Java协程,其实做Java这么久我也没有怎么听过Java协程的东西,但是 ...