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文件,可执行文档编辑.转换.保存等操作. ...
随机推荐
- EFCore 通过实体Model生成创建SQL Server数据库表脚本
在我们的项目中经常采用Model First这种方式先来设计数据库Model,然后通过Migration来生成数据库表结构,有些时候我们需要动态通过实体Model来创建数据库的表结构,特别是在创建像临 ...
- TypeScript 命名空间
随着代码的不断增加,我们需要有组织的组合代码.TypeScript在1.x版本中提供了命名空间的方式进行代码组织,这也是TypeScript官方代码的组织方式.同时,TypeScript还实现了Jav ...
- 剑指offer44:翻转单词顺序列
1 题目描述 牛客最近来了一个新员工Fish,每天早晨总是会拿着一本英文杂志,写些句子在本子上.同事Cat对Fish写的内容颇感兴趣,有一天他向Fish借来翻看,但却读不懂它的意思.例如,“stude ...
- 笔记 - C#从头开始构建编译器 - 2
视频与PR:https://github.com/terrajobst/minsk/blob/master/docs/episode-02.md 作者是 Immo Landwerth(https:// ...
- 3_PHP表达式_1_常量
以下为学习孔祥盛主编的<PHP编程基础与实例教程>(第二版)所做的笔记. PHP常量分为自定义常量与预定义常量. 1.自定义常量 在使用前必须先定义,PHP的define()函数专门用于定 ...
- iOS - 基础知识总结(OC版) 面试必看 再不看就要用swift了
OC的理解与特性 OC作为一门面向对象的语言,自然具有面向对象的语言特性:封装.继承.多态.它既具有静态语言的特性(如C++),又有动态语言的效率(动态绑定.动态加载等).总体来讲,OC确实是一门不错 ...
- vue动态请求到的多重数组循环遍历,取值问题,如果某个值存在则显示,不存在则不显示。
数据结构: 需求:我在vue页面需要拿到url值并显示图片 代码写法: 注意:一定要判断否则拿到的large对象一直是空值, 那么img.large.url将会取不到值,会报 url 'undefi ...
- vue 将时间戳转换成日期格式 (一)
(1)创建一个处理时间格式的js,内容如下: ../../utils/formatDate.js export function formatDate(date, fmt) { if (/(y+)/. ...
- MySQL 数据库的安装与卸载
一.安装 (1)打开下载的 mysql 安装文件双击解压缩,运行“mysql-5.5.40-win32.msi” (2)选择安装类型, 有“Typical(默认) ”. “Complete(完全) ” ...
- iOS毛玻璃效果的实现方法
ios开发中常常用到的毛玻璃效果实现方法 iOS8以后使用系统里的UIBlurEffect可以实现,UIBlurEffect继承自UIVisualEffect UIBlurEffectStyle有三个 ...