jQuery合并单元格以及还原重置
一、合并rowspan
jQuery.fn.rowspan = function(colIdx) {
return this.each(function(){
var that;
$('tr', this).each(function(row) {
$('td:eq('+colIdx+')', this).filter(':visible').each(function(col) {
if (that!=null && $(this).html() == $(that).html()) {
rowspan = $(that).attr("rowSpan");
if (rowspan == undefined) {
$(that).attr("rowSpan",1);
rowspan = $(that).attr("rowSpan"); }
rowspan = Number(rowspan)+1;
$(that).attr("rowSpan",rowspan);
$(this).hide();
} else {
that = this;
}
});
});
});
}
使用方法:$("#tableId").rowspan(0); // 第0列上下一样的数据将合并
二、合并后还原
jQuery.fn.ResetTable=function(){
$("tr",this).each(function(trindex,tritem){
$(tritem).find("td").each(function(tdindex,tditem){
var Rcount=$(tditem).attr("rowspan");
var Ccount=$(tditem).attr("colspan");
var newtd="<td class='Ctd'>"+$(tditem).text()+"</td>";
if(Rcount>1){
var parent=$(tditem).parent("tr")[0];
while(Rcount >1){
$(parent).next().find("td").eq(tdindex).before(newtd);
parent=$(parent).next();
Rcount--;
}
$(tditem).removeAttr("rowspan");
}
if(Ccount>1){
while(Ccount>1){
$(tditem).after(newtd);
Ccount--;
}
$(tditem).removeAttr("colspan");
}
});
});
}
使用方法: $("#tableId").ResetTable();
jQuery合并单元格以及还原重置的更多相关文章
- 【Web】jquery合并单元格
合并单元格的情况,在开发中还是比较多见的,以下仅介绍合并行的情况. 原来的table效果 效果如下: 代码如下: <!DOCTYPE html> <html xmlns=" ...
- jquery操作表格 合并单元格
jquery操作table,合并单元格,合并相同的行 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列}) /** * ...
- 雷林鹏分享:jQuery EasyUI 数据网格 - 合并单元格
jQuery EasyUI 数据网格 - 合并单元格 数据网格(datagrid)经常需要合并一些单元格.本教程将向您展示如何在数据网格(datagrid)中合并单元格. 为了合并数据网格(datag ...
- JQuery EasyUI DataGrid动态合并单元格
/** * EasyUI DataGrid根据字段动态合并单元格 * @param fldList 要合并table的id * @param fldList ...
- NPOI操作EXCEL(五)——含合并单元格复杂表头的EXCEL解析
我们在第三篇文章中谈到了那些非常反人类的excel模板,博主为了养家糊口,也玩命做出了相应的解析方法... 我们先来看看第一类复杂表头: ...... 博主称这类excel模板为略复杂表头模板(蓝色部 ...
- DataTables合并单元格(rowspan)的实现思路(多分组分类的情况)
直接上代码,原理之前的随笔已经讲过了.http://www.cnblogs.com/hdwang/p/7115835.html 1.先看看效果 2.html代码,含js代码 2.1 common.js ...
- 【Javascript】Javascript横向/纵向合并单元格TD
> 需求是这样滴(>_<) 在报表系统中,涉及“HTML的TD单元格的合并”恐怕为数不少. 比如,从DB查得数据并经过后台的整理后,可能是这样的: Table1 JOB TO ...
- easyUI----纵向合并单元格
使用Easyui-DataGrid过程用.做统计/报表等时经常会使用到合并单元格,原生态Easyui-DataGrid没有合并单元格的属性或方法. 解决方案: 代码一 onLoadSuccess: f ...
- BootStrap Table 合并单元格
为了更直观展示表格的一大堆乱七八糟的数据,合并单元格就派上用场: 效果: 贴上JSON数据(后台查询数据一定要对合并字段排序): [ { "city": "广州市&quo ...
随机推荐
- [建树(非二叉树)] 1090. Highest Price in Supply Chain (25)
1090. Highest Price in Supply Chain (25) A supply chain is a network of retailers(零售商), distributors ...
- Internet History, Technology and Security (Week 7)
Week 7 Technology: Application Protocols Welcome to Week 7 of IHTS. This week has less material than ...
- #Leetcode# 707. Design Linked List
https://leetcode.com/problems/design-linked-list/ Design your implementation of the linked list. You ...
- BZOJ5323 JXOI2018游戏(线性筛+组合数学)
可以发现这个过程非常类似埃氏筛,将在该区间内没有约数的数定义为质数,那么也就是求每种方案中选完所有质数的最早时间之和. 于是先求出上述定义中的质数个数,线性筛即可.然后对每个最短时间求方案数,非常显然 ...
- 一种KEIL中定义过的变量在使用中提示未定义的情况
[环境] > KEIL5.25 > win10 > @2018-4-23 [问题] 头文件互包含导致的错误(使用了另一文件的类型定义) 文件<fileA.h> <f ...
- centos下安装ngnix+php+mysql服务
一.nginx 安装 1.查看yum下nginx版本信息 [root@localhost ~]# yum list | grep nginx 2.手动添加nginx的yum仓库 [root@local ...
- ButterKnife注入注解框架用法
Android 依赖注入 ButterKnife 基本使用 - 渐行渐远渐无声 - 博客园http://www.cnblogs.com/fansen/p/5653887.html ButterKnif ...
- 解题:CF949D Curfew
题面 整体的思路就是在均摊每个宿舍的人数,注意一个人可以跑好几次=.= 可以发现多的学生往中间跑一定能跑过宿管,所以只考虑学生们能不能及时跑到人不够的宿舍.对两边记录两个已经满足要求的宿舍,然后用前/ ...
- BZOJ 3505 [Cqoi2014]数三角形
3505: [Cqoi2014]数三角形 Description 给定一个nxm的网格,请计算三点都在格点上的三角形共有多少个.下图为4x4的网格上的一个三角形.注意三角形的三点不能共线. Input ...
- python的字符串截取
str = ‘’ :] #截取第一位到第三位的字符 print str[:] #截取字符串的全部字符 :] #截取第七个字符到结尾 ] #截取从头开始到倒数第三个字符之前 ] #截取第三个字符 ] # ...