我想把图中值相同的列，通过jquery动态合并单元格，哪位大神指导一下？急！！！！
3个回答
展开全部
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<style>
table{width:600px; border:1px solid #ddd;padding:0px;margin:100px auto;border-collapse:collapse;}
table tr>td{border:1px solid #ddd;margin:0px;text-align:center;}
</style>
<script>
$(function(){
$("#do_echo").click(function(){
var province=[];//创建一个数组保存省份
$("#table1 tr").each(function(index) {//遍历一遍tr,选出省份
if(province.length>0){//如果数组长度大于零则数组已经有值
for(var i=0,len=province.length;i<len;i++){//编辑一遍数组，查看当前td的值是否在数组中存在
if(province[i]==$(this).find("td").eq(0).text()) break; //如果存在，提前退出循环
}
if(i==len) province[len]=$(this).find("td").eq(0).text();//i==len证明没有提前退出循环、也就是说这个单元格的值在数组中不存才，将值添加到数组末尾
}else{//否则数组没有只，把第一个单元格的值赋值给数组
province[0]=$(this).find("td").eq(0).text();
}
});
var i=null,len=null;
province.forEach(function(index){//遍历省份
var city=[] //创建一个市的数组，保存市数据
var provinces=$("#table1").find("tr").filter(function(num) { //获取所有该省份的数据
return $(this).find("td").eq(0).text()==index;
});
provinces.each(function(index, element) {//遍历该省份的数据,找出删选出城市相同的数据
debugger;
if(city.length>0){//如果数组长度大于零则数组已经有值
for(var i=0,len=city.length;i<len;i++){//编辑一遍数组，查看当前市的值是否在数组中存在
if(city[i]==$(this).find("td").eq(1).text()){ //如果存在
$(this).prev().find("td").eq(2).text( $(this).prev().find("td").eq(2).text()+"/"+$(this).find("td").eq(2).text());
$(this).hide();
break; //提前退出循环
}
}
if(i==len) city[len]=$(this).find("td").eq(1).text();//i==len证明没有提前退出循环、也就是说这个单元格的值在数组中不存才，将值添加到数组末尾
}else{//否则数组没有只，把第一个单元格的值赋值给数组
city[0]=$(this).find("td").eq(1).text();
}
});
});
});
})
</script>
</head>
<body>
<table id="table1">
<tr>
<td>河北省</td><td>石家庄</td><td>1234</td>
</tr>
<tr>
<td>河北省</td><td>石家庄</td><td>2345</td>
</tr>
<tr>
<td>河北省</td><td>廊坊市</td><td>3456</td>
</tr>
<tr>
<td>河北省</td><td>廊坊市</td><td>4567</td>
</tr>
<tr>
<td>河南省</td><td>郑州市</td><td>5678</td>
</tr>
<tr><td>河南省</td><td>郑州市</td><td>6789</td>
</tr>
<tr>
<td>河南省</td><td>新乡市</td><td>7890</td>
</tr>
<tr>
<td>河南省</td><td>新乡市</td><td>8901</td>
</tr>
</table>
<button id="do_echo">遍历合并</button>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
jQuery.fn.rowspan = function(colIdx) { //封装的一个JQuery小插件
return this.each(function(){
var that;
$('tr', this).each(function(row) {
$('td:eq('+colIdx+')', this).filter(':visible').each(function(col) {
if (that!=null && $(this).html() == $(that).html()) {
rowspan = $(that).attr("rowSpan");
if (rowspan == undefined) {
$(that).attr("rowSpan",1);
rowspan = $(that).attr("rowSpan"); }
rowspan = Number(rowspan)+1;
$(that).attr("rowSpan",rowspan);
$(this).hide();
} else {
that = this;
}
});
});
});
}
$(function() {
$("#table1").rowspan(0);//传入的参数是对应的列数从0开始
$("#table1").rowspan(1);
$("#table1").rowspan(2);
$("#table1").rowspan(3);
});
</script>
</head>
<body>
<table id="table1" border="1" cellpadding="5" cellspacing="0" width="300px">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td>1</td>
<td>f</td>
<td>3</td>
<td>s</td>
</tr>
<tr>
<td>2</td>
<td>f</td>
<td>3</td>
<td>t</td>
</tr>
</table>
</body>
</html>
试试这个
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你确定是列，不是行吗？ 列合一起有什么意义。。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
