使用选择器在jQuery中显示隐藏的嵌套表

Question

我有几个嵌套表的html（在这个例子中只有一个是嵌套的）：

<table class="toptable" border="1">
    <tbody>                   
        <tr class="accordion">
            <td>TD1</td>
            <td>TD2</td>
            <td>TD3</td>
        </tr>
        <tr>
            <td colspan="3">
            <table class="nested" border="1">
                <tbody>
                    <tr>
                        <td>nestedTD1</td>
                        <td>nestedTD2</td>
                    </tr>
                    <tr>
                        <td>nestedTD3</td>
                        <td>nestedTD4</td>
                    </tr>
                </tbody>
            </table>          
            </td>
        </tr>
    </tbody>
</table>

我的jQuery允许我通过点击第一行来显示/隐藏主表的第二行。

$(function() {
  $(".toptable tr:not(.accordion)").hide();
  $(".toptable tr:first-child").show();
  $(".toptable tr.accordion").click(function(){
  $(this).nextAll().fadeToggle();
    });
  });

工作示例在这里：http://jsfiddle.net/nbag/pAxry/1/

我的问题是只显示嵌套表的第一行。我想树中的问题遍历jquery;我试图将nextAll()更改为find("*")，但它无效。

非常感谢您的帮助！

Answer 1

我认为问题出在第一个隐藏表行的选择器中。试试这个（demo）：

$(function () {
    $(".toptable > tbody > tr:not(.accordion)").hide();
    $(".toptable tr:first-child").show();
    $(".toptable tr.accordion").click(function () {
        $(this).next().fadeToggle();
    });
});