合并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. Codeforces961F. k-substrings

    $n \leq 1000000$的字符串,对每一个子串$i$~$n-i+1$,求他最长的一个既是前缀又是后缀的子串. 这题要求的东西具有“对称性”,不充分利用难以解决.这里的“对称性”不仅指询问是对称 ...

  2. hdu 4952

    Number Transformation Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Ot ...

  3. android图片上传

    package com.example.center; import java.io.ByteArrayOutputStream;import java.io.InputStream; import ...

  4. Linux 环境下思源黑体字体与 Java 之间的兼容性问题的解决(补充说明)

    在前一篇随笔中,我讲了一下有关 Linux 环境下思源黑体与 Java 之间的兼容性问题,后来经过测试发现,默认安装的思源黑体字体同时包含简体字体和繁体字体,并且其对应的语言编码也是不同的.尝试着把繁 ...

  5. HDu1241 DFS搜索

    #include<iostream> #include<cstring> using namespace std; int a[105][105]; int d[8][2]={ ...

  6. LCA rmq st model

    LCA:倍增 memset(p,-,sizeof(p)); inline void dfs(int u) { ;i=e[i].next) { int v=e[i].v; ) { deep[v]=dee ...

  7. Credit Memo和Debit Memo在AR以及AP中的概念比较

    AR和AP中都有Credit Memo和Debit Memo的概念, 但是其含义和用法完全不一样,比较难懂,现在整理如下:AR中的CreditMemo和DebitMemo是和客户打交道:AR中的Cre ...

  8. Android:BLE智能硬件开发详解

    目录 前言 BLE是个什么鬼 BLE中的角色分工 主要的关键词和概念 GATT(Generic Attribute Profile ) Characteristic Service Android如何 ...

  9. [转]文件IO详解(二)---文件描述符(fd)和inode号的关系

    原文:https://www.cnblogs.com/frank-yxs/p/5925563.html 文件IO详解(二)---文件描述符(fd)和inode号的关系 ---------------- ...

  10. 在windows中增加linux命令

    在windows中增加linux命令 无它,复用git中的即可: