合并table中某一列相邻的相同的行
​1. [代码]合并table中某一列相邻的相同的行  
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>RunJS</title>
    <script id="jquery_183" type="text/javascript" class="library" src="http://sandbox.runjs.cn/js/sandbox/jquery/jquery-1.8.3.min.js"></script>
    <!-- CSS goes in the document HEAD or added to your external stylesheet -->
<style type="text/css">
table.hovertable {
    font-family: verdana,arial,sans-serif;
    font-size:11px;
    color:#333333;
    border-width: 1px;
    border-color: #999999;
    border-collapse: collapse;
}
table.hovertable th {
    background-color:#c3dde0;
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: #a9c6c9;
}
table.hovertable tr {
    background-color:#d4e3e5;
}
table.hovertable td {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-color: #a9c6c9;
}
</style>
<script>
$(function(){
    $("table tr").live("mouseover",function(){
        $(this).css("backgroundColor","#ffff66");
    })
    $("table tr").live("mouseout",function(){
        $(this).css("backgroundColor","#d4e3e5");
    })
    hebingRows(2);
})
function hebingRows(col){
    var trs = $("table tr");
    var rows = 1;
    for(var i=trs.length;i>0;i--){
        var cur = $($(trs[i]).find("td")[col]).text();
        var next = $($(trs[i-1]).find("td")[col]).text();
        if(cur==next){
            rows++;
            $($(trs[i]).find("td")[col]).remove();
        } else {
            $($(trs[i]).find("td")[col]).attr("rowspan",rows);
            rows=1;
        }
    }
}
</script>
    </head>
    <body>
        <!-- Table goes in the document BODY -->
<table class="hovertable">ppt素材
<tr>http://www.huiyi8.com/ppt/​
    <th>Info Header 1</th><th>Info Header 2</th><th>Info Header 3</th>
</tr>
<tr >
    <td>Item 1A</td><td>Item 1B</td><td>Item 1C</td>
</tr>
<tr >
    <td>Item 2A</td><td>Item 2B</td><td>Item 1C</td>
</tr>
<tr >
    <td>Item 3A</td><td>Item 2B</td><td>Item 1C</td>
</tr>
<tr >
    <td>Item 4A</td><td>Item 4B</td><td>Item 2C</td>
</tr>
<tr >
    <td>Item 5A</td><td>Item 5B</td><td>Item 2C</td>
</tr>
<tr >
    <td>Item 4A</td><td>Item 5B</td><td>Item 3C</td>
</tr>
<tr >
    <td>Item 5A</td><td>Item 4B</td><td>Item 4C</td>
</tr>
<tr >
    <td>Item 4A</td><td>Item 5B</td><td>Item 4C</td>
</tr>
<tr >
    <td>Item 5A</td><td>Item 5B</td><td>Item 5C</td>
</tr>
</table>
    </body>
</html>
​

合并table中某一列相邻的相同的行的更多相关文章

  1. 封装Jquery 合并table中任何同列数据

    封装代码: jQuery.fn.rowspan = function (colIdx) { //封装JQuery同列值相同合并小插件 return this.each(function () { va ...

  2. 使用jquery合并表格中相同文本的相邻单元格

    一.效果 二.代码 <!DOCTYPE HTML> <html> <head> <title>Example</title> <met ...

  3. JavaScript实现获取table中某一列的值

    JavaScript实现获取table中某一列的值 1.实现源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...

  4. JavaScript获取table中某一列的值的方法

    1.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  5. jquery合并表格中相同文本的相邻单元格

    <!DOCTYPE HTML> <html> <head>   <title>Example</title>   <meta char ...

  6. 给table中某一列的文字右对齐

    一般来说,没写过jquery的前端人员,肯定是定义一个class,给每一行的那列加上align_r{text-align:right}.这是很麻烦的. 所以用jquery来写,可以$("ta ...

  7. 关于页面中table中相同的列自动合并

    代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  8. 使用js合并table中的单元格

    用primefaces做的报表,领导要求合并相同内容的单元格,但是primefaces没有找到可以合并单元格的组件,想来想去,只有页面加载后用js合并了. http://blog.csdn.net/d ...

  9. HTML锁定Table中某一列

    1. 2. 3. function ChangeTable() { var type = document.getElementById("ddl_ReportType").val ...

随机推荐

  1. 洛谷 [P3834] 可持久化线段树（主席树）

    主席树可以存储线段树的历史状态,空间消耗很大,一般开45n即可 #include <iostream> #include <cstdio> #include <cstri ...

  2. Wiley出版 SQL Server 2005宝典

    原文发布时间为:2008-07-30 -- 来源于本人的百度文章 [由搬家工具导入] Wiley出版 SQL Server 2005宝典 迅雷专用高速下载    thunder://QUFmdHA6L ...

  3. css,世界上没有绝对简单的事情

    引文 自从学了前端的基础,自认为是没什么css是能难倒我的,可是事实是,世界上没有绝对简单的事情,实际上还有好多的东西等待我们去发掘. 详解 1.有些浏览器不完全支持css3,现在可以用 modern ...

  4. Croc Champ 2013 - Round 2 C. Cube Problem

    问满足a^3 + b^3 + c^3 + n = (a+b+c)^3 的 (a,b,c)的个数 可化简为 n = 3*(a + b) (a + c) (b + c) 于是 n / 3 = (a + b ...

  5. DispatcherServlet url-pattern中 /、/*、*.do中的区别与作用

    DispatcherServlet url-pattern中 /./*.*.do中的区别与作用 "/'表示匹配所有请求(其中包含除.jsp和.jspx外的所有后缀). 如果不配置静态资源,它 ...

  6. 转：HtmlCxx用户手册

    1.1 简介 使用由KasperPeeters编写的强大的tree.h库文件,可以实现类似STL的DOM树遍历和导航. 打包好的Css解析器. 看似很像C++代码的C++代码(其实已不再是C++了) ...

  7. Maven项目配置外部依赖（本地依赖）

    加入有一些公共jar包只限于公司内部使用,不能暴露在外部时,有如下的方案: 1.搭建私有远程仓库(nexus) 2.使用http.ftp.共享地址,github地址等(主要是通过maven-deplo ...

  8. TFS2018 获取所有Build变量及变量值

    添加一个Command Line 步骤,Tool设置为 cmd ,并设置参数为 /k set 注意:若在执行时出现如下报错信息,Tool的值改成 cmd.exe --20T02::.0416435Z ...

  9. ci中 chrome对favicon.ico请求，导致log报错 解决方法

    chrome浏览器会自动对favicon.ico进行请求,所以当没有为网站添加 favicon.ico 时会出现404的页面错误在实际开发过程中,CI框架 打开 ERROR log,会一直显示ERRO ...

  10. Leetcode41: Remove Duplicates from Sorted List

    Given a sorted linked list, delete all duplicates such that each element appear only once. For examp ...