合并table中某一列相邻的相同的行
合并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中某一列相邻的相同的行的更多相关文章
- 封装Jquery 合并table中任何同列数据
封装代码: jQuery.fn.rowspan = function (colIdx) { //封装JQuery同列值相同合并小插件 return this.each(function () { va ...
- 使用jquery合并表格中相同文本的相邻单元格
一.效果 二.代码 <!DOCTYPE HTML> <html> <head> <title>Example</title> <met ...
- JavaScript实现获取table中某一列的值
JavaScript实现获取table中某一列的值 1.实现源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...
- JavaScript获取table中某一列的值的方法
1.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...
- jquery合并表格中相同文本的相邻单元格
<!DOCTYPE HTML> <html> <head> <title>Example</title> <meta char ...
- 给table中某一列的文字右对齐
一般来说,没写过jquery的前端人员,肯定是定义一个class,给每一行的那列加上align_r{text-align:right}.这是很麻烦的. 所以用jquery来写,可以$("ta ...
- 关于页面中table中相同的列自动合并
代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- 使用js合并table中的单元格
用primefaces做的报表,领导要求合并相同内容的单元格,但是primefaces没有找到可以合并单元格的组件,想来想去,只有页面加载后用js合并了. http://blog.csdn.net/d ...
- HTML锁定Table中某一列
1. 2. 3. function ChangeTable() { var type = document.getElementById("ddl_ReportType").val ...
随机推荐
- Codeforces961F. k-substrings
$n \leq 1000000$的字符串,对每一个子串$i$~$n-i+1$,求他最长的一个既是前缀又是后缀的子串. 这题要求的东西具有“对称性”,不充分利用难以解决.这里的“对称性”不仅指询问是对称 ...
- hdu 4952
Number Transformation Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Ot ...
- android图片上传
package com.example.center; import java.io.ByteArrayOutputStream;import java.io.InputStream; import ...
- Linux 环境下思源黑体字体与 Java 之间的兼容性问题的解决(补充说明)
在前一篇随笔中,我讲了一下有关 Linux 环境下思源黑体与 Java 之间的兼容性问题,后来经过测试发现,默认安装的思源黑体字体同时包含简体字体和繁体字体,并且其对应的语言编码也是不同的.尝试着把繁 ...
- HDu1241 DFS搜索
#include<iostream> #include<cstring> using namespace std; int a[105][105]; int d[8][2]={ ...
- 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 ...
- Credit Memo和Debit Memo在AR以及AP中的概念比较
AR和AP中都有Credit Memo和Debit Memo的概念, 但是其含义和用法完全不一样,比较难懂,现在整理如下:AR中的CreditMemo和DebitMemo是和客户打交道:AR中的Cre ...
- Android:BLE智能硬件开发详解
目录 前言 BLE是个什么鬼 BLE中的角色分工 主要的关键词和概念 GATT(Generic Attribute Profile ) Characteristic Service Android如何 ...
- [转]文件IO详解(二)---文件描述符(fd)和inode号的关系
原文:https://www.cnblogs.com/frank-yxs/p/5925563.html 文件IO详解(二)---文件描述符(fd)和inode号的关系 ---------------- ...
- 在windows中增加linux命令
在windows中增加linux命令 无它,复用git中的即可: