Bootstrap - 可折叠行 - 隐藏我们正在扩展的显示行

Question

我有一张包含展开行列表的表格 我的一个<tr> 是父级，下一个是我正在扩展的子级

我想在第二行没有展开时隐藏它。 下面是我正在使用的代码 我还添加了图片：我想隐藏的红色<tr>。您还可以在下一行看到展开的<tr>：

 <tr class="clickable apply-max-width">
    <td class="table-tr1-td1 togglebutton" data-toggle="collapse" data-target="#accordion5"><b aria-hidden="true"><img src="../images/plus.png"/></b></td>
    <td>joed123@yahoo.com</td>
    <td colspan="2">WD154590</td>
    <td>2/1/2017</td>
    <td>Yes</td>
    <td></td>
</tr>
<tr>
    <td></td>
    <td></td>
    <td colspan="2">
        <div id="accordion5" class="accordion collapse data-found">

            <table class="table table-striped data-table-inner-disabled div-found">
                <thead>
                    <tr>
                        <th></th>
                        <th class="">Application</th>
                        <th class="">App Role</th>
                        <th>Workflow Status</th>

                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="application-User-inv"><img src="../images/delete_1.png" class="img-responsive" /></td>
                        <td class="application-User-inv">Portal</td>
                        <td>User</td>
                        <td>Pending Approval</td>
                    </tr>
                    <tr>
                        <td class="application-User-inv"><img src="../images/delete_1.png" class="img-responsive" /></td>
                        <td class="application-User-inv">SSR</td>
                        <td>User</td>
                        <td>Provisioned</td>
                    </tr>
                </tbody>
            </table>

        </div>
    </td>
    <td></td>
    <td>

    </td>
    <td></td>
</tr>

Answer 1

如果可能，您应该在这里尝试使用JQuery。这样您就可以使用 JS 来管理显示/隐藏元素的状态，并且可以将状态保存在浏览器中。