过滤表格

Question

我正在创建一个带有表格的原型网站。我只是想知道如何过滤表格内容？示例我有两个按钮，分别是'作家'和'插画家'，当我点击编辑按钮时，我只想让表格显示作者。

是否可以使用表格行 id class过滤它？

像：

<table>    
  <tr class="writer">
     <td>John Doe </td>
     <td>Jan 01, 1980</td>
     <td>jondoe@domain.com</td>
  </tr>
  <tr clas="illustrator">
     <td>Jane Doe </td>
     <td>Sept 01, 1980</td>
     <td>janedoe@domain.com</td>
  </tr>
  <tr class="illustrator">
     <td>Mel Smith </td>
     <td>Aug 01, 1980</td>
     <td>meeeeel@domain.com</td>
  </tr>
  <tr class="writer">
     <td>Harry Smith </td>
     <td>Dec 01, 1980</td>
    <td>hsmith@domain.com</td>
  </tr>
</table>

还是有简单的方法吗？

Answer 1

你在寻找像

这样的东西吗？

jQuery(function () {
    $('#illustrator').click(function () {
        $('table tr.writer').hide();
        $('table tr.illustrator').show();
    })
    $('#writer').click(function () {
        $('table tr.writer').show();
        $('table tr.illustrator').hide();
    })
})

演示：Fiddle