合并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. Mysql字符集与校对规则

    字符集是一套字符和编码的集合,校对规则是用于比较字符集的一套规则. 所以字符集有两部分组成字符集合和对应的编码集合.比如说,现在有这几个字符:A B a b, 假设它们对应的编码分别是00, 01, ...

  2. [Python] 'unicode' object is not callable

    在Python中,出现'unicode' object is not callable的错误一般是把字符串当做函数使用了.

  3. hanzi 全拼音 qu de

    Function pinyin(ByVal mystr As String, Optional types As Byte = 0) As StringDim temp   As String, i ...

  4. cobbler api接口开发测试实例

    条件1:必须搭建好cobbler服务,并且可以通过web访问:http://cobbler_ip/cobbler_web 测试可以打开.然后再用以下命令测试. #!/opt/python3/bin/p ...

  5. Codeforces 665D Simple Subset【构造】

    题目链接: http://codeforces.com/problemset/problem/665/D 题意: 给定序列,从中找出最大的子集,使得子集中的数两两相加均为质数. 分析: 貌似有用最大团 ...

  6. C# 多线程小试牛刀

    前言 昨天在上班时浏览博问,发现了一个问题,虽然自己在 C# 多线程上没有怎么尝试过,看了几遍 CLR 中关于 线程的概念和讲解(后面三章).也想拿来实践实践.问题定义是这样的: 对于多线程不是很懂, ...

  7. HDU - 5974 A Simple Math Problem （数论 GCD）

    题目描述: Given two positive integers a and b,find suitable X and Y to meet the conditions: X+Y=a Least ...

  8. T3185 队列练习1 codevs

    http://codevs.cn/problem/3185/ 题目描述 Description 给定一个队列(初始为空),只有两种操作入队和出队,现给出这些操作请输出最终的队头元素. 操作解释:1表示 ...

  9. VC++下编译Libgeotiff(含Libtiff)

    转自原文Win10+VC++下编译Libgeotiff(含Libtiff)详细图文教程 GeoTiff是包含地理信息的一种Tiff格式的文件.Libgeotiff就是一个操作GeoTiff文件的库.同 ...

  10. lib无法访问另外lib中的头文件

    工程中app已经有设置User Header Search Paths来包含了需要的头文件,但是个别的lib依然找不到头文件.解决方法: 选择这个lib,在Build Settings中查找选项Use ...