2

テーブルがあり、いくつかの行を展開可能にしたいのですが、行をクリックすると、その親行の下にある他のいくつかの行が展開されます。すべての行が展開可能である必要はありません。jQueryは問題ありません。誰かがこれをどのように達成できるかについてのヒントを教えてもらえますか、またはマニュアルを指摘できますか？

ありがとう。

4

2 に答える 2

7

私の仕事のプロジェクトでも同様のリクエストがありました。これは私が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）に到達するまで要素を選択し続けます。

于 2011-02-04T01:10:09.377 に答える
0

ここにいくつかの簡単なチュートリアルがありますhttp://designgala.com/how-to-expand-collapse-toggle-div-layer-using-jquery/、テーブル行を処理するように変換するだけですが、divの使用を検討する必要があります

于 2011-02-03T19:47:32.647 に答える