JSP中table表格合并列相同的内容

最新推荐文章于 2023-02-21 11:03:04 发布

唱响星河

最新推荐文章于 2023-02-21 11:03:04 发布

阅读量2.5k

点赞数

分类专栏： JSP table 文章标签： table合并列

JSP 同时被 2 个专栏收录

12 篇文章 0 订阅

订阅专栏

table

1 篇文章 0 订阅

订阅专栏

转自：https://blog.csdn.net/qq_34129814/article/details/80255444

页面的table表格中又是需要将相同的数据栏合并，今天就学到了一个简单实用有效的方法：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>

<table id="table1">
<tr>
<td>111</td>
<td>222</td>
<td>333</td>
</tr>
<tr>
<td>111</td>
<td>555</td>
<td>333</td>
</tr>
<tr>
<td>111</td>
<td>888</td>
<td>333</td>
</tr>
<tr>
<td>aaa</td>
<td>bbb</td>
<td>333</td>
</tr>
</table>

<script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script>

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);//传入的参数是对应的列数从0开始第二列合并相同
});
</script>

</script>
</html>

唱响星河

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JSP中table表格合并列相同的内容

转自：https://blog.csdn.net/qq_34129814/article/details/80255444页面的table表格中又是需要将相同的数据栏合并，今天就学到了一个简单实用有效的方法：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8">...
复制链接

扫一扫