1.合并

function autoRowSpan(tbid, row, col) {
var tb = document.getElementById(tbid);
var lastValue = "";
var value = "";
var pos = 1;
for (var i = row; i < tb.rows.length; i++) {
value = tb.rows[i].cells[col].innerText;
if (lastValue == value) {
tb.rows[i].deleteCell(col);
tb.rows[i - pos].cells[col].rowSpan = tb.rows[i - pos].cells[col].rowSpan + 1;
pos++;
} else {
lastValue = value;
pos = 1;
}
}
}
2.根据上一例合并记录合并下一列

function autoRowSpan2(tbid, row, col) {
var tb = document.getElementById(tbid);
var lastValue = "";
var value = "";
var pos = 1;
for (var i = row; i < tb.rows.length; i++) {
var rospan = tb.rows[i].cells[0].getAttribute('rowSpan');
if (rospan > 1) {
lastValue = tb.rows[i].cells[col].innerText;

var index = 1;
for (var j = i + 1; j < tb.rows.length; j++) {
if (index == rospan) break;

value = tb.rows[j].cells[col - 1].innerText;
//alert(value);
if (lastValue == value) {
tb.rows[j].deleteCell(col - 1);
index++;
} else {
lastValue = value;
}
}
tb.rows[i].cells[col].rowSpan = index;
//tb.rows[i].cells[col].rowSpan = index;
}
}
}

function merge() {
var totalRow = $("#table_ZC tbody").find("tr").length;
var totalCol = $("#table_ZC tbody").find("tr").eq(0).find("td").length;
for (var col = totalCol - 7; col >= 0; col--) {
spanNum = 1;
startCell = $("#table_ZC tbody").find("tr").eq(totalRow - 1).find("td").eq(col);

for (var row = totalRow - 1; row >= 1; row--) {
targetCell = $("#table_ZC tbody").find("tr").eq(row - 1).find("td").eq(col);
if (startCell.text() == targetCell.text() && startCell.text() != "") {

spanNum++;
targetCell.attr("rowSpan", spanNum);
startCell.remove();
} else {
spanNum = 1;
}
startCell = targetCell;
}
}
}

3.合并table 的第一个单元格

function merge() {
var totalRow = $(".jjtable tbody").find("tr").length;

spanNum = 1;
startCell = $(".jjtable tbody").find("tr").eq(totalRow - 1).find("td").eq(0);

for (var row = totalRow - 1; row >= 1; row--) {
targetCell = $(".jjtable tbody").find("tr").eq(row - 1).find("td").eq(0);
if (startCell.text() == targetCell.text() && startCell.text() != "") {

spanNum++;
targetCell.attr("rowSpan", spanNum);
startCell.remove();
} else {
spanNum = 1;
}
startCell = targetCell;
}
}

js 表格合并的更多相关文章

  1. js 表格合并单元格

    5列  根据需要可添加 或 删除 strOneTemp  strTwoTemp  strThreeTemp  strFourTemp  strFiveTemp //合并单元格  this.mergeC ...

  2. jquery操作表格 合并单元格

    jquery操作table,合并单元格,合并相同的行 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列}) /** * ...

  3. element-ui 使用span-method表格合并后hover样式的处理

    在使用element表格合并后,发现鼠标只有移入第一个合并行时,合并的部分会高亮,移入其他行,不会高亮,这样效果看起来不是很好.查看了文档也没有直接的解决方法,就通过现有的方法处理了一下,解决了hov ...

  4. 关于表格合并span-method方法的补充(表格数据由后台动态返回)

    之前写了一些关于element-ui表格合并的方法,不过用的数据都是确定的数据(死数据),但是很多时候我们的数据都是通过后台获得的,数据不稳定,这个时候使用表格合并就需要先处理一下数据,先看一下一种很 ...

  5. js文件合并,压缩,缓存,延迟加载

    做web前段也有一段时间了,对于web中js文件的加载有些体会想跟大家一起分享一下. 1.首先说说js文件的合并和压缩吧 为了便于集中式管理js的合并和压缩我们创建一个Js.ashx文件来专门处理合并 ...

  6. CSS 和 JS 文件合并工具

    写 CSS 和 JavaScript 的时候, 我们会遇到一个两难的局面: 要么将代码写在一个大文件, 要么将代码分成多个文件. 前者导致文件难以管理, 代码复用性差, 后者则因为需要在载入多个文件令 ...

  7. gulp 之一 安装及简单CSS,JS文件合并压缩

    最近研究了一下gulp构建工具,发现使用起来比grunt顺手一些.(个人感受),以下是grunt和gulp构建方式和原理: grunt 基于文件方式构建,会把文件先写到临时目录下,然后进行读文件,修改 ...

  8. QTableWidget表格合并若干问题及解决方法

    Qt提供 QTableWidget作为表格的类以实现表格的基本功能,表格中所装载的每一个单元格由类QTableWidgetItem提供.这是基于表格实现 Qt提供的一个基础类,若想实现定制表格和单元格 ...

  9. element-ui表格合并span-method

    先看一下合并后的样式,表格第二行,二三四列合并 官网给我们提供了span-method的方法可以进行表格合并,有4个参数返回:row,column,rowIndex,columnIndex;row和c ...

随机推荐

  1. Android开发 LevelListDrawable详解

    前言 此篇博客正在施工中... 作者其实就是想挖个坑备忘一下... 十分抱歉, 可以参考https://www.jianshu.com/p/f9ec65241b6b

  2. 【BZOJ4916】神犇与蒟蒻

    题面 Description 很久很久以前,有一只神犇叫yzy; 很久很久之后,有一只蒟蒻叫lty; Input 请你读入一个整数N;\(1<=N<=10^9\),A.B模\(10^9+7 ...

  3. 【JZOJ3303】城市规划

    description 刚刚解决完电力网络的问题, 阿狸又被领导的任务给难住了. 刚才说过, 阿狸的国家有n 个城市, 现在国家需要在某些城市对之间建立一些贸易路线, 使得整个国家的任意两个城市都直接 ...

  4. 廖雪峰Java11多线程编程-3高级concurrent包-4Concurrent集合

    Concurrent 用ReentrantLock+Condition实现Blocking Queue. Blocking Queue:当一个线程调用getTask()时,该方法内部可能让给线程进入等 ...

  5. AMPQ

    AMPQ AMQP,即Advanced Message Queuing Protocol,高级消息队列协议, 是`应用层协议的一个开放标准,为面向消息的中间件设计`. 由于AMQP是一个网络协议,所以 ...

  6. data方法也是模型类的连贯操作方法之一,

    data方法也是模型类的连贯操作方法之一,用于设置当前要操作的数据对象的值. 写操作 通常情况下我们都是通过create方法或者赋值的方式生成数据对象,然后写入数据库,例如: $Model = D(' ...

  7. shell学习笔记1: shell 中的变量与常见符号使用方法

    变量 声明即用 a=2 b="123" 调用 ${varName}或者 $varName echo $b echo ${a} 常见变量 $?:判断上一个语句是否成功 $0:执行脚本 ...

  8. 服务器迁移部署PosWeb

    绑定 基本配置 高级配置

  9. python学习笔记4.2_正则表达式

    常用正则表达式:http://tool.chinaz.com/regex/ 1.正则表达式:提供了一种在文本中灵活查找或匹配字符串模式的方法.单个表达式通常被称为regex. 2.python的re模 ...

  10. 史上最贵域名诞生!360斥资1700万美元买360.com

    昨日,360公司官方人士向腾讯科技确认,公司已斥巨资收购国际顶级域名360.com.传闻这一收购价格为1700万美元,约合人民币1.1亿元. 史上最贵域名诞生!360斥资1700万美元买360.com ...