jquery - 如何使用 JQuery 检查 Ajax Control Toolkit CollapsiblePanelExtender 是否折叠？

Question

我有以下 ASP.NET 代码：

<div id="pnlFiltros" class="card">
    <asp:Panel ID="pnlFiltrosHeader" runat="server" CssClass="card-header bg-verdepetrobras text-white">
        Filtros (<asp:Label ID="lblTextFiltros" runat="server" />)
    </asp:Panel>
    <asp:Panel ID="pnlFiltrosContent" runat="server" CssClass="card-body">
        <div class="form-row">
            <div class="form-group col-md-6">
                <label>Chave / Nome</label>
                <asp:TextBox ID="txtChaveNome" runat="server" CssClass="form-control" />
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-md-2">
                <asp:Button ID="btPesquisar" runat="server" CssClass="btn btn-primary" Text="Pesquisar" OnClick="btPesquisar_Click" />
            </div>
        </div>
    </asp:Panel>
</div>

<ajaxToolkit:CollapsiblePanelExtender ID="cpExtFiltros" runat="server" TargetControlID="pnlFiltrosContent" CollapseControlID="pnlFiltrosHeader" ExpandControlID="pnlFiltrosHeader"
    Collapsed="false" TextLabelID="lblTextFiltros" CollapsedText="Clique para exibir..." ExpandedText="Clique para esconder..."
    CollapsedSize="0"></ajaxToolkit:CollapsiblePanelExtender>

如何检查 Ajax Control Toolkit CollapsiblePanelExtender 是否使用 JQuery 折叠？

Answer 1

您可以通过给定的行为 ID 访问的功能很少

<ajaxToolkit:CollapsiblePanelExtender ID="LimitedByTypePanelExtender" runat="server" TargetControlID="LimitedByTypePanel" BehaviorID="bhvLimitedByType" Collapsed="true">
</ajaxToolkit:CollapsiblePanelExtender>

如果您$find('bhvLimitedByType')在 chrome 控制台中检查对象，您可以在下面看到原型中的更多方法

所以根据这个，你可以用来检查面板是否折叠。

var isLimitedByCollapsed = $find('bhvLimitedByType').get_Collapsed();

Answer 2

我的解决方法是获得“pnlFiltrosContent”的高度。如果为 0px，则面板折叠。

            if ($('#<%=pnlPerfilContent.ClientID%>').css("height") == "0px")
                alert("Is collapsed");