过滤表格

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