博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用JQ实现相同行或列合并
阅读量:6280 次
发布时间:2019-06-22

本文共 2652 字,大约阅读时间需要 8 分钟。

/*** @ function:合并指定表格列(表格id为table_id)指定列(列数为table_colnum)的相同文本的相邻单元格* @ param:table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data * @ param:table_colnum 为需要合并单元格的所在列。为数字,从最左边第一列为1开始算起。*/function table_rowspan(table_id, table_colnum) {    table_firsttd = "";    table_currenttd = "";    table_SpanNum = 0;    table_Obj = $(table_id + " tr td:nth-child(" + table_colnum + ")");        table_Obj.each(function (i) {        if (i == 0) {            table_firsttd = $(this);            table_SpanNum = 1;        } else {            table_currenttd = $(this);            if (table_firsttd.text() == table_currenttd.text()) { //这边注意不是val()属性,而是text()属性                //td内容为空的不合并                if(table_firsttd.text() !=""){                    table_SpanNum++;                    table_currenttd.hide(); //remove();                    table_firsttd.attr("rowSpan", table_SpanNum);                }            } else {                table_firsttd = $(this);                table_SpanNum = 1;            }        }    });}
/** @ function:合并指定表格行(表格id为table_id)指定行(行数为table_rownum)的相同文本的相邻单元格* @ param:table_id 为需要进行合并单元格的表格id。如在HTMl中指定表格 id="data" ,此参数应为 #data * @ param:table_rownum 为需要合并单元格的所在行。其参数形式请参考jquery中nth-child的参数。          如果为数字,则从最左边第一行为1开始算起。          "even" 表示偶数行          "odd" 表示奇数行          "3n+1" 表示的行数为1、4、7、10.......* @ param:table_maxcolnum 为指定行中单元格对应的最大列数,列数大于这个数值的单元格将不进行比较合并。          此参数可以为空,为空则指定行的所有单元格要进行比较合并。*/function table_colspan(table_id, table_rownum, table_maxcolnum) {    if (table_maxcolnum == void 0) { table_maxcolnum = 0; }    table_firsttd = "";    table_currenttd = "";    table_SpanNum = 0;    $(table_id + " tr:nth-child(" + table_rownum + ")").each(function (i) {        table_Obj = $(this).children();        table_Obj.each(function (i) {            if (i == 0) {                table_firsttd = $(this);                table_SpanNum = 1;            } else if ((table_maxcolnum > 0) && (i > table_maxcolnum)) {                return "";            } else {                table_currenttd = $(this);                if (table_firsttd.text() == table_currenttd.text()) {                    //td内容为空的不合并                    if (table_firsttd.text() !="") {                    table_SpanNum++;                    table_currenttd.hide(); //remove();                    table_firsttd.attr("colSpan", table_SpanNum);                    table_firsttd.attr("style", "text-align:center");                    }                } else {                    table_firsttd = $(this);                    table_SpanNum = 1;                }            }        });    });}

 

转载于:https://www.cnblogs.com/chcong/p/9602529.html

你可能感兴趣的文章
游戏开发经常使用算法概述
查看>>
EDM制作要点
查看>>
爆牙齿的Web标准面试考题II(iPhone SMS/iChat UI的Web标准实现)
查看>>
XMOVE3.0手持终端——软件介绍(二):在2KB内存的单片机上实现的彩屏GUI控件库
查看>>
MVC系列——MVC源码学习:打造自己的MVC框架(三:自定义路由规则)
查看>>
找小于N 的所有质数
查看>>
Windows下的Jupyter Notebook 的介绍(写给新手)(图文详解)
查看>>
iOS开发-CocoaPods实战
查看>>
JS组件系列——Bootstrap 树控件使用经验分享
查看>>
HTML-color:rgb()-颜色渐进
查看>>
数据库实例: STOREBOOK > 表空间 > 编辑 表空间: UNDOTBS1
查看>>
Mcad学习笔记之异步编程(AsyncCallback委托,IAsyncResult接口,BeginInvoke方法,EndInvoke方法的使用小总结)...
查看>>
Javascript防冒泡事件与Event对象
查看>>
1.LinQ初体验 简单的示例(原创)
查看>>
Docker容器学习梳理--Volume数据卷使用
查看>>
WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!
查看>>
ios 人脸检测
查看>>
Android设计中的.9.png
查看>>
CentOS下Mycat+MySQL水平分割负载均衡配置记录
查看>>
Ubuntu & GitLab CI & Docker & ASP.NET Core 2.0 自动化发布和部署(2)
查看>>