一、合并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合并单元格以及还原重置的更多相关文章

  1. 【Web】jquery合并单元格

    合并单元格的情况,在开发中还是比较多见的,以下仅介绍合并行的情况. 原来的table效果 效果如下: 代码如下: <!DOCTYPE html> <html xmlns=" ...

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

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

  3. 雷林鹏分享:jQuery EasyUI 数据网格 - 合并单元格

    jQuery EasyUI 数据网格 - 合并单元格 数据网格(datagrid)经常需要合并一些单元格.本教程将向您展示如何在数据网格(datagrid)中合并单元格. 为了合并数据网格(datag ...

  4. JQuery EasyUI DataGrid动态合并单元格

    /**        * EasyUI DataGrid根据字段动态合并单元格        * @param fldList 要合并table的id        * @param fldList ...

  5. NPOI操作EXCEL(五)——含合并单元格复杂表头的EXCEL解析

    我们在第三篇文章中谈到了那些非常反人类的excel模板,博主为了养家糊口,也玩命做出了相应的解析方法... 我们先来看看第一类复杂表头: ...... 博主称这类excel模板为略复杂表头模板(蓝色部 ...

  6. DataTables合并单元格(rowspan)的实现思路(多分组分类的情况)

    直接上代码,原理之前的随笔已经讲过了.http://www.cnblogs.com/hdwang/p/7115835.html 1.先看看效果 2.html代码,含js代码 2.1 common.js ...

  7. 【Javascript】Javascript横向/纵向合并单元格TD

    > 需求是这样滴(>_<) 在报表系统中,涉及“HTML的TD单元格的合并”恐怕为数不少. 比如,从DB查得数据并经过后台的整理后,可能是这样的: Table1     JOB TO ...

  8. easyUI----纵向合并单元格

    使用Easyui-DataGrid过程用.做统计/报表等时经常会使用到合并单元格,原生态Easyui-DataGrid没有合并单元格的属性或方法. 解决方案: 代码一 onLoadSuccess: f ...

  9. BootStrap Table 合并单元格

    为了更直观展示表格的一大堆乱七八糟的数据,合并单元格就派上用场: 效果: 贴上JSON数据(后台查询数据一定要对合并字段排序): [ { "city": "广州市&quo ...

随机推荐

  1. Beta冲刺(5/7)

    队名:天机组 组员1友林 228(组长) 今日完成:修改代码 明天计划:封装代码 剩余任务:优化网络通讯机制 主要困难:暂无 收获及疑问:暂无 组员2方宜 225 今日完成:优化了ui界面 明天计划: ...

  2. vue 实战 遇到问题记录

    vue-router  配置路由遇到问题 1.一个 new Router({ routes:[ { path:'/', component:Good    ///不要写成components  否则报 ...

  3. debug阶段贡献分

    组名: 新蜂 组长: 武志远 组员: 宫成荣 谢孝淼 杨柳 李峤 项目名称: java俄罗斯方块NEO 发布时间:11.29 武志远 武志远 武志远 武志远 武志远 宫成荣 宫成荣 杨柳 宫成荣 宫成 ...

  4. TP 等框架在配置虚拟主机伪静态注意事项

    在配置虚拟主机的伪静态 .htaccess 文件时需要注意 ? 符号的添加与否处理 例如TP 框架来讲 无 ? 符号,在有的虚拟主机中必须这样配置,否则无法解析(试了多个公司的虚拟主机只要加了?符号就 ...

  5. [转帖] 学习一下 apache bench 的总结简介 ( LAMP的没用过..)

    PS:网站性能压力测试是性能调优过程中必不可少的一环.只有让服务器处在高压情况下才能真正体现出各种设置所暴露的问题.Apache中有个自带的,名为ab的程序,可以对Apache或其它类型的服务器进行网 ...

  6. [转贴]systemd 编写服务管理脚本

    [转贴]sparkdev大神的博客, 关于 systemd的配置文件的 介绍, 自己之前二进制安装 k8s 时 超过一个 service文件 但是当时不明不白的. 现在再学习一下大神的文章 的确牛B ...

  7. 理解RESTful架构【转】

    越来越多的人开始意识到,网站即软件,而且是一种新型的软件. 这种"互联网软件"采用客户端/服务器模式,建立在分布式体系上,通过互联网通信,具有高延时(high latency).高 ...

  8. UVALive6443_Alien Abduction Again

    题意为给你若干个三次函数,以及每一个函数所分布的区间,由于每个函数的所有的系数都是整数,所以最后的函数在整数点处的值也是整数. 现在每次可以插入函数或者询问区间,现在要求每次询问区间后,所有的函数在这 ...

  9. 【转载】JSP 获取真实IP地址的代码

    JSP 获取真实IP地址的代码 在JSP里,获取客户端的IP地址的方法是:request.getRemoteAddr(),这种方法在大部分情况下都是有效的.   但是在通过了 Apache,Squid ...

  10. C++模式学习------单例模式

    单例(Singleton)模式,是一种常用的软件设计模式.在应用这个模式时,单例对象的类必须保证只有一个实例存在.许多时候整个系统只需要拥有一个的全局对象,这样有利于我们协调系统整体的行为.例如一些类 ...