js实现table合并相同列单元格
/** * Created with JetBrains WebStorm. * User: Johnny * Date: 18-3-26 * Time: 下午4:48 * Table td 相同值合并行 要求: * 1.table 必须包含tbody,tbody为数据主休 * 2.table 添加 id="kbdatas" * 调用说明: * $(function(){ * mergeRowSpan(4); * }); */function uuidStr() {var s = [];var hexDigits = "0123456789abcdef";for (var i = 0; i < 36; i++) {s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1); }s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010 s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01 s[8] = s[13] = s[18] = s[23] = "-";var uuid = s.join("");return uuid;} function merge(icol){var tdTxt = "";var list_map = new Array();var uuid = uuidStr();$("#kbdatas").find("tbody tr").each(function(){var rmnode = $(this).attr("rmnode");if(rmnode==null||rmnode==undefined||rmnode==""){rmnode = 0; }var icolIndex = icol-rmnode;var txt = $(this).find("td:eq("+icolIndex+")").text().trim();if(tdTxt != txt){uuid = uuidStr();list_map.push(uuid);tdTxt = txt; }$(this).find("td:eq("+icolIndex+")").attr("tduuid",uuid); });for(var i = 0; i < list_map.length; i++){var tduuid = list_map[i];$("#kbdatas").find("td[tduuid='"+tduuid+"']").each(function(index,el){var tdlg = $("#kbdatas").find("td[tduuid='"+tduuid+"']").length;if(0==index){$(el).attr("rowspan",tdlg); } else {var rmnode = $(el).parent().attr("rmnode");if(rmnode==null||rmnode==undefined||rmnode==""){rmnode = 1; } else {rmnode++; }$(el).parent().attr("rmnode",rmnode);$(el).remove(); } }); }}function mergeRowSpan(colCount){for(var icol = 0; icol < colCount; icol++){ merge(icol); }}
转载于:https://www.cnblogs.com/rey888/p/8674287.html
js实现table合并相同列单元格相关推荐
- 表格怎么合并两列数据php,怎么合并两列单元格的文字
合并两列单元格的文字的方法:首先打开一个excel表:然后选择一个要放合并之后内容的单元格,并在单元格中输入公式"=A1&B1()":最后按Enter回车键即可. 本文操作 ...
- Excel合并多列单元格并自动换行
Excel合并多列单元格并自动换行 例:需要合并D9,E9,F9,G9三列,合并后D9,E9,F9,G9列内容换行 至H9 第一:设置H列自动换行 解释:但需要将单元格格式里设置"自动换行& ...
- html表单合并两列单元格,table合并单元格colspan和rowspan .
colspan和rowspan这两个属性用于创建特殊的表格. colspan是"column span(跨列)"的缩写.colspan属性用在td标签中,用来指定单元格横向跨越的列 ...
- element ui中table合并相同内容单元格
一.遍历需要合并的集合,定义spanArr数组 二.在table中增加事件 三.调用objectSpanMethod方法,合并单元格
- python指定一列为KEY 合并多列单元格 并设置单元格行高
一.需求 1.第一列Sku数值相同的,合并A-E列,J-M列 2.M列设置行高完全显示内容 3.A1单元格内数字是SKU个数,合并单元格后数字更新 二.效果图 input入力文件处理前: 文件处理后 ...
- 解决element UI table 表格 固定列单元格错位
最近在使用表格组件的固定列后,才发现表格有样式bug,在使用点击事件切换表格尺寸大小时,会发现固定列样式没有对齐,在切换页面之后,就会出现列错误的现象,如下: 解决方法: 1.给表格添加ref < ...
- 记录:element UI table 表格 固定列单元格上下错位
一.表格添加ref <el-table ref="table"></el-table> 二.页面切换或数据更新时调用 this.$nextTick(() = ...
- iview的table合并相同的单元格
效果图 代码 export default{data(){spanb:[]} },mounted:function(){let contactDotb = 0;let spanb = [];this. ...
- 【element-ui】 el-table 表格动态合并相同数据单元格最全教程,可指定列+自定义合并条件,附完整代码
el-table合并单元格 1.固定合并 官方挺提供的合并具体某行列的方法:el-table合并行或列 通过给table传入span-method方法可以实现合并行或列,方法的参数是一个对象,里面包含 ...
最新文章
- AB1601串口之bugs
- mongodb和SQL语句对应查找表
- WordPress可视化拖拽自助建站主题The7 V10.0.0
- 嘉奥丰农显示无法连接服务器,Arcaea无法连接服务器如何解决
- PHP 规划(收藏的一些好博文)
- linux下安装vmware tools的方法
- 移动端页面开发资源总结
- [BZOJ4523]路由表
- MyBatis单表增删改查--接口实现
- ecshop在nginx下实现负载均衡
- linux密码安全加固文件,LINUX安全加固方案
- vs2017 社区版
- matlab 梯度下降 求偏导,通过计算图求梯度下降中各偏导的推导
- Win 10 添加Epson网络打印机后刚开始可以打印,过一会就脱机
- 计算机桌面不同步,电脑有时候出现时间不同步怎么办,解决方法
- 带宽、线速、吞吐量概念
- TaintDroid 剖析之 DVM 变量级污点跟踪(下篇)
- The path to the Subversion executable is probably wrong. Fix it.
- 电脑麦克风输入没声音,如何解决
- 2022年宜昌助理工程师职称评审流程和条件是什么呢?甘建二