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 ...
随机推荐
- SQL语句中order_by_、group_by_、having的用法区别
order by 从英文里理解就是行的排序方式,默认的为升序. order by 后面必须列出排序的字段名,可以是多个字段名. group by 从英文里理解就是分组.必须有“聚合函数”来配合才能使用 ...
- node websocket学习研究
websocket作为不同于http的数据传输方式,是开发一些实时系统的不二选择. 最近在研究开发websocket方面的小程序.小程序客户端直接对websocket做了封装.自己只要写后端就可以了. ...
- Vue.js——60分钟browserify项目模板快速入门
概述 在之前的一系列vue.js文章,我们都是用传统模式引用vue.js以及其他的js文件的,这在开发时会产生一些问题. 首先,这限定了我们的开发模式是基于页面的,而不是基于组件的,组件的所有代码都直 ...
- Thread start()方法和run()方法的区别
转自:http://www.cnblogs.com/skywang12345/p/3479083.html start():作用一个新的线程,新线程会执行相应的run()方法,start()不能被重复 ...
- Python 变量 (上)
Python通过变量引用内存中的值,变量的值占用多少空间是由变量的类型决定的.声明变量不需要指定变量的类型,解释器会自动根据值来判断.变量名称必须符合标识符的定义 标识符 标识符是由字母,数字和下划线 ...
- NOI2010~NOI2018选做
[NOI2010] [NOI2010]海拔 高度只需要0/1,所以一个合法方案就是一个割,平面图求最小割. [NOI2010]航空管制 反序拓扑排序,每次取出第一类限制最大的放置,这样做答案不会更劣. ...
- uoj259 & 独立集问题的一些做法
很早以前就做了一遍这题,当时好像啥都不会,今天重做一下. 这个题题意简单地说就是输入k.p和一个图,求图大小为k的独立集个数mod p. subset1.in n=24,m=19,k=8 subse ...
- redis学习 - 数据持久化
Redis提供了多种不同级别的持久化方式: RDB 持久化可以在指定的时间间隔内产生数据集的时间点快照(point-in-time snapshot) AOF持久化记录服务器执行的所有写操作命令,并在 ...
- 【bzoj2780】 Sevenk Love Oimaster
http://www.lydsy.com/JudgeOnline/problem.php?id=2780 (题目链接) 题意 给出很多主串和很多询问串,求一个询问串在多少主串中出现过 Solution ...
- Monitor WMIExportsToC++Use DiskCleanup bypass UAC
作者:嘶吼吼链接:https://zhuanlan.zhihu.com/p/23473665来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. About: Use odb ...