jquery 如何能去掉表中指定列重复的数据

Question

我有如下的表，我想让年月列，如果有重复，就隐藏该单元格

序号     年月 部门 录入人
1 2017-12 教育部 xx
2 2017-7 运输部 11111
3 2017-7 财务部 xxxc
4 2017-6 财务部 sdc
5 2017-6 运输部 sdc

变成

         

序号     年月 部门 录入人
1 2017-12 教育部 xx
2 2017-7 运输部 11111
3         财务部 xxxc
4 2017-6 财务部 sdc
5          运输部 sdc

用jquey 如何实现？

Answer 1

论坛的排版有的问题，就是年月字段重复，则隐藏

Answer 2

你的前端的表格用什么制作的？jQuery的Table还是什么技术呢？

具体生成代码呢？

---

ASP.NET Forum
StackOverFlow
FreeRice Donate
Issues to report

Answer 3

你好，后端是mvc,前端就是普通的html和bootstrap

<table class="table table-hover">
            <thead>
                <tr>
                    <th>序号</th>
                    <th>年月</th>
                    <th>部门</th>
                    <th>录入人</th>
                    <th>录入时间</th>
                    <th></th>
                </tr>
            </thead>
            <tr>
                <td>
                    1
                </td>
                <td>
                    2017-12
                </td>
                <td>
                    运输部
               </td>
                <td>
                   xx
                </td>
                <td>
                    2017-12-24
                </td>
                <td>
                    <a href="/ghLMTest/ttt/Details/8">浏览</a> 
                </td>
            </tr>
            <tr>
                <td>
                    2
                </td>
                <td>
                    2017-7
                </td>
                <td>
                    财务部
               </td>
                <td>
                   11111
                </td>
                <td>
                    2017-07-29
                </td>
                <td>
                    <a href="/ghLMTest/ttt/Details/1017">浏览</a> 
                </td>
            </tr>
  
            ...................
        </table>

Answer 4

<table border="1">
    <tr><td>序号</td><td>年月</td><td>部门</td><td>录入人</td></tr>
    <tr><td>1</td><td>2017-12</td><td>部门</td><td>录入人</td></tr>
    <tr><td>2</td><td>2017-7</td><td>部门</td><td>录入人</td></tr>
    <tr><td>3</td><td>2017-7</td><td>部门</td><td>录入人</td></tr>
    <tr><td>4</td><td>2017-6</td><td>部门</td><td>录入人</td></tr>
    <tr><td>5</td><td>2017-6</td><td>部门</td><td>录入人</td></tr>
</table>
 
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
    var kv = {}
    $('table tr:gt(0) td:nth-child(2)').each(function () {
        if (kv[this.innerHTML]) this.innerHTML = '';
        else kv[this.innerHTML] = true;
    });
</script>

答案有了，可是还是不太明白

 $('table tr:gt(0) td:nth-child(2)')

这句是 过滤表格（大于第一行标题行） 单元格只选第2列

 if (kv[this.innerHTML])

 这句是怎么判断出重复的？

Answer 5

你好，

你可以尝试使用下面的代码：

    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var tr = $(".table").find("tr");
            var rowspan = 1;
            for (var i = tr.length - 1; i > 0; i--) {
                //得到前一行第二列的值.
                var predate = $(tr[i - 1]).find("td:eq(1)").html();
                //得到当前行第二列的值.
                var date = $(tr[i]).find("td:eq(1)").html();
                //比较数据
                if (predate == date) {
                    rowspan++;
                    //删除当前单元格，方便设置rowspan 属性
                    $(tr[i]).find("td:eq(1)").remove();
                }
                else {
                    //设置rowspan属性
                    $(tr[i]).find("td:eq(1)").attr("rowspan", rowspan);
                    nextdate = date;
                    rowspan = 1;
                }
                
            };
        });
    </script>

   <table class="table table-hover">
                <thead>
                    <tr >
                        <th>序号</th>
                        <th>年月</th>
                        <th>部门</th>
                        <th>录入人</th>
                        <th>录入时间</th>
                        <th></th>
                    </tr>
                </thead>  
                <tr>
                    <td>0</td>
                    <td >2017-12</td>
                    <td>教育部</td>
                    <td>xx</td>
                    <td>2017-12-24</td>
                    <td><a href="/ghLMTest/ttt/Details/8">浏览</a></td>
                </tr>
                <tr>
                    <td>1</td>
                    <td >2017-12</td>
                    <td>教育部</td>
                    <td>xx</td>
                    <td>2017-12-24</td>
                    <td><a href="/ghLMTest/ttt/Details/8">浏览</a></td>
                </tr>
                  <tr>
                    <td>2</td>
                    <td>2017-7</td>
                    <td>运输部</td>
                    <td>11111</td>
                    <td>2017-7-24</td>
                    <td><a href="/ghLMTest/ttt/Details/8">浏览</a></td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>2017-7</td>
                    <td>运输部</td>
                    <td>xxxx</td>
                    <td>2017-07-29</td>
                    <td>
                        <a href="/ghLMTest/ttt/Details/1017">浏览</a>
                    </td>
                </tr>
                <tr>
                    <td>4</td>
                    <td>2017-6</td>
                    <td>财务部</td>
                    <td>11111</td>
                    <td>2017-06-29</td>
                    <td>
                        <a href="/ghLMTest/ttt/Details/1017">浏览</a>
                    </td>
                </tr>
            </table>

结果输出如下：