合并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. LVM 类型的 Storage Pool

    LVM 类型的 Storage Pool 不仅一个文件可以分配给客户机作为虚拟磁盘,宿主机上 VG 中的 LV 也可以作为虚拟磁盘分配给虚拟机使用. 不过,LV 由于没有磁盘的 MBR 引导记录,不能 ...

  2. JavaScript 的时间消耗--摘抄

    JavaScript 的时间消耗 2017-12-24 dwqs 前端那些事儿 随着我们的网站越来越依赖 JavaScript, 我们有时会(无意)用一些不易追踪的方式来传输一些(耗时的)东西. 在这 ...

  3. Java成长之路

    怎样学习才能从一名Java初级程序员成长为一名合格的架构师,或者说一名合格的架构师应该有怎样的技术知识体系,这是不仅一个刚刚踏入职场的初级程序员也是工作三五年之后开始迷茫的老程序员经常会问到的问题.希 ...

  4. htmlcxx取指定字段实例

    #include <string> #include <iostream> #include <sstream> #include <htmlcxx/html ...

  5. Java中String字符串toString()、String.valueOf()、String强转、+ ""的区别

    Object#toString(): Object object = getObject(); System.out.println(object.toString()); 在这种使用方法中,因为ja ...

  6. mysql 隔离级别与间隙锁等

    数据库隔离级 SQL标准中DB隔离级别有: read uncommitted:可以读到其它transaction 未提交数据 read committed:可以读到其它transaction 已提交数 ...

  7. redis集群设置密码详解

    原文:http://lookingdream.blog.51cto.com/5177800/1827851 注意事项: 1.如果是使用redis-trib.rb工具构建集群,集群构建完成前不要配置密码 ...

  8. Go -- 交叉编译

    编译Windows程序和mac程序

  9. Python爬虫之简单的图片获取

    简单的静态网页的图片获取: import urllib import re import os url = 'http://www.toutiao.com/a6467889113046450702/' ...

  10. OC - 读歌词

    类的头文件: #import <Foundation/Foundation.h> //FILE_PATH是文件名称. #define FILE_PATH @"/Users/qia ...