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文件,可执行文档编辑.转换.保存等操作. ...
随机推荐
- SDK的使用步骤
SDK包括三种类型文件: (1).头文件(.h) (2).库文件(.lib) (3).动态库(.dll) 第一步:在项目目录中新建一个Libs文件夹,再在该文件夹中分别新建inc文件夹和lib文件夹, ...
- Python 编程入门
我喜欢直接了当, 这次主要是推荐蟒营大妈的 Python 入门课(https://py.101.camp), 还有不到一周就要开课了, 欢迎转发推荐~ 点击"夏日大作战:从小白到小能手的 P ...
- 17 SUMIF函数、countif函数、averagif函数
情景 按买家求他们的消费各是多少. 可以考虑使用分类汇总来做,但这里我们使用函数sumif来做. SUMIF函数 格式:=SUMIF(条件列表,匹配条件,数据区) 该函数这样理解:按照匹配条件,从条件 ...
- PAT(B) 1042 字符统计（Java）字符串 正则表达式 统计
题目链接:1042 字符统计 (20 point(s)) 题目描述 请编写程序,找出一段给定文字中出现最频繁的那个英文字母. 输入格式 输入在一行中给出一个长度不超过 1000 的字符串.字符串由 A ...
- PAT(B) 1071 小赌怡情（Java）
题目链接:1071 小赌怡情 (15 point(s)) 题目描述 常言道"小赌怡情".这是一个很简单的小游戏:首先由计算机给出第一个整数:然后玩家下注赌第二个整数将会比第一个数大 ...
- 应用编排服务之ELK技术栈示例模板详解
日志对互联网应用的运维尤为重要,它可以帮助我们了解服务的运行状态.了解数据流量来源甚至可以帮助我们分析用户的行为等.当进行故障排查时,我们希望能够快速的进行日志查询和过滤,以便精准的定位并解决问题. ...
- 浅谈(IOC)依赖注入与控制反转(DI)
前言:参考了百度文献和https://www.cnblogs.com/liuqifeng/p/11077592.html以及http://www.cnblogs.com/leoo2sk/archive ...
- Spark机器学习基础-无监督学习
0.K-means from __future__ import print_function from pyspark.ml.clustering import KMeans#硬聚类 #from p ...
- 关于Vue中，$this.router.push到当前页面，只是传入参数不同，页面不刷新的问题解决
在页面的watch中,监听$router的变化 watch: { $route (to, from) { this.$router.go(0) } } 其中this.$router.go(0)为刷新页 ...
- Android驱动之设备树简介
目录 一. 设备树简介 2 1. 问题一:为什么需要设备树? 2 ①名词解释: 2 ②DT详细介绍: 2 ③DTS是DT的源文件,描述Device Tree中的设备 ...