使用jQuery扩展表中的某些行

Question

我有一个表,并希望使一些行可扩展 - 单击一行将展开该父行下的其他几行.并非所有行都应该是可扩展的.jQuery会好的.任何人都可以告诉我如何实现这一目标或指向手册吗？

谢谢.

Answer 1

在我的工作中,我们对项目提出了类似的要求.这是我在jsfiddle上做的一个快速示例.

<table>
    <tbody>
        <tr class="main">
            <td >
                <span class="expand">
                    expand</span>
            </td>
            <td>
                Show
            </td>
            <td>
                Show
            </td>
        </tr>
        <tr class="hidden">
            <td colspan="3">
                hidden 1
            </td>
        </tr>
        <tr class="hidden">
            <td colspan="3">
                hidden 2
            </td>
        </tr>
</table>

现在是jQuery

$("td span.expand").click(function() {
    $(this).parents("tr.main").nextUntil("tr.main").toggle();
});

此示例使用nextUntil,它将继续选择元素,直到它到达定义的选择器,在本例中为tr.main