合并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 ...
随机推荐
- 洛谷 [P3480] KAM-Pebbles
博弈论转化 本题的限制条件很多,我们尝试转化, 我们发现,定义 c[i] 为第 i 堆可以取得数量,如果第 i 堆取出了 x ,那么 c[i] - x , c[i + 1] + x 我们发现这是一个反 ...
- UOJ#370. 【UR #17】滑稽树上滑稽果
$n \leq 1e5$个点,每个点有个权值$a_i \leq 2e5$.现将点连成树,每个点$i$的链接代价为$a_i \ \ and \ \ i父亲的代价$,这里的$and$是二进制按位与,求最小 ...
- localStorag的一点见解
dot方法对localStorag方法进行键值操作 设值 localStorage.hello = 'world'; localStorage.zhangsan = 'lisi'; 取值: var v ...
- R语言入门视频笔记--4--R的数据输入
输入 R的数据输入可以大体三种: 1.键盘输出 2.从文本文件导入 3.从Excel中导入数据 一.从键盘输入 首先创建一个数据框,玩玩嘛,瞎建一个 mydata <- data.frame(a ...
- Xcode6 pch文件
XCode6里, 默认是没有pch文件的,如果我们想使用pch文件,需要手动添加,添加步骤如下 1.在XCode6中是么有pch文件的,如下图 2.创建pch文件 3.配置pch文件 ...
- LeetCode第一题以及时间复杂度的计算
问题描述:给定一组指定整数数组,找出数组中加和等于特定数的两个数. 函数(方法)twoSum返回这两个数的索引,index1必须小于index2. 另外:你可以假设一个数组只有一组解. 一个栗子: I ...
- Spring Boot集成Spring Data Reids和Spring Session实现Session共享(多个不同的应用共用一个Redis实例)
从Redis的Key入手,比如Spring Session在注解@EnableRedisHttpSession上提供了redisNamespace属性,只需要在这里设置不同的值即可,效果应该是这样的: ...
- 自动化中间人攻击工具subterfuge小实验
Subterfuge是一款用python写的中间人攻击框架,它集成了一个前端和收集了一些著名的可用于中间人攻击的安全工具. Subterfuge主要调用的是sslstrip,sslstrip 是08 ...
- BUPT复试专题—密码(2009)
题目描述 输入 有多组输入,每组: 第一行:由26个小写字母组成的串以空格隔开,如 b a c e u f g h i j k l m n o p q r s t v w x y z d v y ...
- HDU1114 Piggy-Bank 【全然背包】
Piggy-Bank Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total ...