jQuery函数根据单元格值隐藏/显示行

时间:2013-01-25 16:10:29

标签: javascript jquery html html-table

我有以下表格布局:

Company_Name | Address | Date
------------------------------
Company A     address1   date 
Company A     address1   diff-date
Company A     address1   diff-date

有没有办法隐藏底部两行,点击第一个“公司A”行时应该显示这两行?基本上我希望将任何相同的公司名称值隐藏为公司第一个实例的子行。

编辑:当前代码:

<table id="companyTable" class="tablesorter">
    <thead>
    <tr>
        <th>Company_Name</th>
        <th>Address</th>
        <th>Date</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>CompanyA</td>
        <td>Address1</td>
        <td>Date</td>
    </tr>
    <tr>
        <td>CompanyA</td>
        <td>Address1</td>
        <td>Diff-Date</td>
    </tr>
    <tr>
        <td>CompanyA</td>
        <td>Address1</td>
        <td>Diff-Date</td>
    </tr>
</tbody>
</table>

1 个答案:

答案 0 :(得分:0)

<tr class="company_a">
  ...
</tr>
<tr class="company_a">
  ...
</tr>
<tr class="company_a">
  ...
</tr>
<script>

// hide all company_a
$(".company_a").hide();

// show first company_a
$(".company_a:first").show().click(function() {

  // show all company_a when first company_a is clicked
  $(".company_a").show();

});
</script>