顯示/隱藏所有TR-S內部表

Question

下面是HTML結構

<table class="views-table cols-3"> 
     <caption> 
     <h2>LINK(which will hide/show all trs in this table)</h2> 
     </caption> 
    <thead> 
    <tbody> 
    ... 
    </tbody> 
</table> 

此表與同一類重複ñ倍。請幫助使用js或jquery腳本，在鏈接被點擊的表格中隱藏/顯示所有tr -s或整個<tbody>。

Answer 1

在jQuery中：

(jQuery.noConflict())(function($){ 
    $('.views-table cols-3 h2').click(function(){ 
     if($(this).parent('.views-table').find('TBODY > TR')[0].is(':visible')) { 
      $(this).parent('.views-table').find('TBODY > TR').hide(); 
     } else { 
      $(this).parent('.views-table').find('TBODY > TR').show(); 
     } 
    }); 
}); 

Answer 2

$(".views-table h2").click(function(){ 
     var table = $(this).parents("table"); 
     var tbody = table.children("tbody"); 
     if(tbody.is(':visible')){ 
       tbody.hide(); 
     }else{ 
      tbody.show(); 
     } 

}); 

嘗試此鏈接http://jsfiddle.net/wFcpP/8/

Answer 3

$('.views-table h2').click(function() { 
     $(this).closest('table').find('tbody').toggle(); 
});