手风琴需要知道它何时折叠

Question

我正在使用 Ajax Control Toolkit Accordion Version 1.0.11119.0，我需要知道窗格何时折叠。是否有客户端索引更改事件？

Answer 1

没有客户端索引更改事件，但是您可以看一下这个 文章。

<script type="text/javascript">
    var accordion;
    var handlerFired;
    function pageLoad() {

        accordion = $find("Accordion1_AccordionExtender"); //parameter should be the ID_AccordionExtender
        accordion.add_selectedIndexChanged(selectedIndexChangedHandler)
    }
    function selectedIndexChangedHandler(sender, args) {
        if (handlerFired) {
            //add this variable to prevent firing the handler twice.
            handlerFired = false;
            return;
        }

        if (confirm("Would you like to change the index from " + args._oldIndex + " to " + args._selectedIndex + "?")) {
            return;
        } else {
            handlerFired = true;
            // if we don't want to change the index, we need to set it to the old value.
            accordion.set_SelectedIndex(args._oldIndex);
        }
    }

</script>


<cc1:Accordion ID="Accordion1" runat="server" HeaderCssClass="accordionHeader" HeaderSelectedCssClass="accordionHeaderSelect"
        ContentCssClass="accordionContent" FadeTransitions="True" FramesPerSecond="40"
        TransitionDuration="250" AutoSize="None" RequireOpenedPane="false" SuppressHeaderPostbacks="false"
        SelectedIndex="-1">
        <Panes>
            <cc1:AccordionPane ID="AccordionPane1" runat="server">
                <Header>
                    <p>
                        Header1</p>
                </Header>
                <Content>
                    <p>
                        This is the content area!</p>
                </Content>
            </cc1:AccordionPane>
            <cc1:AccordionPane ID="AccordionPane2" runat="server">
                <Header>
                    <p>
                        Header2</p>
                </Header>
                <Content>
                    <p>
                        This is the content area!</p>
                </Content>
            </cc1:AccordionPane>
            <cc1:AccordionPane ID="AccordionPane3" runat="server">
                <Header>
                    <p>
                        Header3</p>
                </Header>
                <Content>
                    <p>
                        This is the content area!</p>
                </Content>
            </cc1:AccordionPane>
        </Panes>
    </cc1:Accordion>