Question

我正在努力想出一种切换位于我的Ajax Accordion标头内的标签的css类的方法。

我希望标题内的span标记的类根据是否选择特定标题而更改（基本上将加号图标更改为减号图标）。手风琴部分的代码如下。我还没有尝试创建JS或Jquery脚本。

<asp:Accordion 
    ID="Accordion1"   
    CssClass="accordion"  
    HeaderCssClass="acc_Header"  
    HeaderSelectedCssClass="acc_HeaderSelected"  
    ContentCssClass="accordionContent" 
    AutoSize ="none"
    RequireOpenedPane="false"
    FadeTransitions ="true"
    TransitionDureation="250"
    FramesPerSecond="40"
    SelectedIndex="-1"
    SuppressHeaderPostBack ="true"
    runat="server">
        <Panes>
            <asp:AccordionPane ID="SubsidencePane1" runat="server">
                <Header><span class="icon-plus-circle"></span>What is the definition of subsidence?</Header>
                <Content>
                    <p>This is where the ground beneath a structure has suffered downward movement, causing damage to the property.</p>  
                    <p>The movement of the ground is a consequence of some activity in the ground unconnected with the weight or presence of the building.</p>
                    <p>The damage that normally occurs in properties suffering from subsidence is cracking in the walls; these cracks can be diagonally, vertical or horizontal.</p>  
                    <p>However not all cracking is attributable to subsidence therefore a specialist surveyor is often called upon to determine the cause of the cracking to ensure the cause falls under the definition of subsidence.</p>
                </Content>
            </asp:AccordionPane>

Answer 1

使用以下代码解决问题：

$(document).ready(function () {
        $(".accordion div").click(function () {
            $("> span", this).toggleClass("icon-plus-circle icon-minus-circle");
        });

选择Accordion选项卡时切换子元素类

1 个答案: