html table动态合并单元格 js方法
<script>
$(document).ready(function(){
function mc(tableId, startRow, endRow, col) {
var tb = document.getElementById(tableId);
if (col >= tb.rows[0].cells.length) {
return;
}
if (col == 0) { endRow = tb.rows.length-1; }
for (var i = startRow; i < endRow; i++) {
if (tb.rows[startRow].cells[col].innerHTML == tb.rows[i + 1].cells[0].innerHTML) {
tb.rows[i + 1].removeChild(tb.rows[i + 1].cells[0]);
tb.rows[startRow].cells[col].rowSpan = (tb.rows[startRow].cells[col].rowSpan | 0) + 1;
if (i == endRow - 1 && startRow != endRow) {
mc(tableId, startRow, endRow, col + 1);
}
} else {
mc(tableId, startRow, i + 0, col + 1);
startRow = i + 1;
}
}
}
mc('table1',0,0,0);
})
</script>
html table动态合并单元格 js方法的更多相关文章
- react antd Table动态合并单元格
示例数据 原始数组 const data = [ { key: '0', name: 'John Brown', age:22, address: 'New York No. 1 Lake Park' ...
- EasyUI-DataGrid动态合并单元格
js /** * EasyUI DataGrid根据字段动态合并单元格 * @param fldList 要合并table的id * @param fldList 要合并的列,用逗号分隔(例如:&qu ...
- JQuery EasyUI DataGrid动态合并单元格
/** * EasyUI DataGrid根据字段动态合并单元格 * @param fldList 要合并table的id * @param fldList ...
- easyui 自动动态合并单元格
.......onLoadSuccess : function(data) { if (data.rows.length > 0) { //调用mergeCellsByField()合并单元格 ...
- element-ui 合并单元格的方法
arraySpanMethod({ row, column, rowIndex, columnIndex }) { // 只合并区域位置 //columnIndex 横的第一列 ...
- <table>标签的结构和合并单元格的方法
1.<table>标签的结构 示例代码: <table border="1"> <caption>信息统计表</captio ...
- react ,ant Design UI中table组件合并单元格并展开详情的问题
需求:购物车订单列表,如图: 一:单元格合并 遇到这种你会怎么办呢? 单元格合并? 还是其他的方法? 下面是我的处理方式,就是在table 组件的columns上处理,这里拿商品举例,其余的类似, ...
- css table之合并单元格
colspan 是合并列,rowspan是合并行,合并行的时候,比如rowspan="2",它的下一行tr会少一列:合并列的时候 colspan="2",此行的 ...
- 基于EasyUi的datagrid合并单元格JS写法
$('#dg').datagrid({ width: 'auto', height: 'auto', scrollbarSize: , queryParams: {}, url: 'kkkk', co ...
随机推荐
- CentOS安装Nvidia显卡驱动提示Nouveau正在使用的问题
如题,在安装Nvidia官方提供的驱动时,提示Nouveau正在被使用,需要停用后才能继续安装,在网上搜了不少方法,各种尝试后均无效. 最后通过设置内核启动参数给屏蔽了,方法如下: 切换到root用户 ...
- Winform开发框架之单据窗体生成(主从表,流水单号)
源码地址:https://github.com/GarsonZhang/GZFramework.ShareDemo 前言 1.在开始本节前请先重置代码为 chapter-03-start 懒人地址:h ...
- maven环境快速搭建
----------------准备工作------------- Jdk 1.5以上java开发环境. Eclipse IDE 一个. Maven 3.0.3下载地址: http://maven. ...
- 将php网站移到CentOS 6.7上[二]:将网站部署到服务器上
首先,确保lamp环境已安装好.准备好项目源代码,数据库备份文件等.由于没有安装好VNC,因此只能用ssh部署了. 将项目源代码压缩,Linux默认是支持SFTP的,用SFTP将源代码压缩包上传到 / ...
- RSync实现文件备份同步详解
1.rsync简介 rsync是Unix下的一款应用软件,它能同步更新两处计算机的文件与目录,并适当利用差分编码以减少数据传输.rsync中一项与其他大部分类似程序或协议中所未见的重要特性是镜像对每个 ...
- Workspace defines a VM that does not contain a valid jre/lib/rt.jar: C:\Program Files\Java\jre7
Maven编译时两则信息 (Workspace以及default classpath container) 博客分类: Java 使用Maven一年有余,却总是被两则不起眼的编译信息困扰,终想查明 ...
- openssl evp 哈希算法(md5,sha1,sha256)
1. 简述 openssl提供了丰富密码学工具,一些常用的哈希算法 比如md5,sha 可以直接用提供的md5.h ,sha.h 接口使用: 为了方便开发者使用,openssl 又提供了一个EVP, ...
- Naive Bayes理论与实践
Naive Bayes: 简单有效的常用分类算法,典型用途:垃圾邮件分类 假设:给定目标值时属性之间相互条件独立 同样,先验概率的贝叶斯估计是 优点: 1. 无监督学习的一种,实现简单,没有迭代,学习 ...
- Objective-C(内存管理)
引用计数器 每个OC对象都有一个占4个字节存储空间的引用计数器 当使用或创建一个对象时,新对象的引用计数器默认是1 retain:可以使引用计数器+1 release:可以是引用计数器-1 retai ...
- Html5实现移动端、PC端 刮刮卡效果
刚从南方回来就分了一个刮刮卡效果的页面,特么的我在烦恼怎么用H5去实现这个效果呢,好不容易写出来了,产品居然说:“既然你可以写出来这个效果那当然好了,开始我只是打算让你实现点击就出现呢!”… … 尼玛 ...