大佬教程收集整理的这篇文章主要介绍了Jquery显示/隐藏多个表行，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
Jfiddle：http://jsfiddle.net/vcolmenar/wG8qf/1/
表格的HTML数据
主要
数据
<tr class="main">
<td>
<a href="#" class="main">12345</a>
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
11111
</td>
</tr>
<tr class="main">
<td>
<a href="#" class="main">12345</a>
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
11111
</td>
</tr>
<tr class="main">
<td>
<a href="#" class="main">12345</a>
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
11111
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
22222
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
33333
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
44444
</td>
</tr>
$(document).ready(function() {
//Hide table rows with class 'min',but appear when clicked.
$(".data").hide();
$(".main").click(function() {
$(this).parent().parent().next(".data").toggle("fast");
});
});
tr.data {display：none;}
JavaScript的
$(function(){
$("#main-data-table","body").on({'click':function(event){
event.preventDefault();
$(this).closest("tr.main").nextUntil("tr.main").toggle("fast");
}},"a.main",null);
});
HTML
<table id="main-data-table">
<thead><tr>
<th>Main</th>
<th>Data</th>
</tr></thead>
<tfoot></tfoot>
<tbody>
<tr class="main">
<td>
<a href="#" class="main">12345</a>
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
11111
</td>
</tr>
<tr class="main">
<td>
<a href="#" class="main">12345</a>
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
11111
</td>
</tr>
<tr class="main">
<td>
<a href="#" class="main">12345</a>
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
11111
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
22222
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
33333
</td>
</tr>
<tr class = "data">
<td>
</td>
<td>
44444
</td>
</tr>
</tbody>
</table>
以上是大佬教程为你收集整理的Jquery显示/隐藏多个表行全部内容，希望文章能够帮你解决Jquery显示/隐藏多个表行所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。