Question

我制作了一个asp.net网站，其中我放了一个jquery手风琴。我的问题是，在回发或刷新后，当前的折叠窗格关闭，页面重置所有内容。这是我的jQuery代码：

jQuery(document).ready(function () {
    function close_accordion_section() {
        jQuery('.button').removeClass('active');
        jQuery('.accordion .accordion-section-content').slideUp(300).removeClass('open');
    }
    jQuery('.button').click(function (e) {
        var currentAttrValue = jQuery(this).attr('href'); 
        if (jQuery(e.target).is('.active')) {
            close_accordion_section();
        }
        else {
            close_accordion_section();
            jQuery(this).addClass('active');
            jQuery('.accordion ' + currentAttrValue).slideDown(300).addClass('open');
            document.getElementById('.accordion ' + currentAttrValue).scrollIntoView();

        }
        e.preventDefault();
    });
});

如何在回发或刷新后保持手风琴窗格打开？在此先感谢

Answer 1

你面临的问题是因为回发后asp.net会刷新整个页面。解决方案是：

将UpdatePanel用于您要更新的地点http://msdn.microsoft.com/en-us/library/system.web.ui.updatepanel(v=vs.110).aspx，以防止PostBack刷新您的网页
在手风琴当前打开并将其打开的回发中包含信息
- 来自asp.net backend
- 或来自javascript with ClientScriptManager.RegisterStartupScript（this.GetType（），“AKey”，“MyFunction（'paramToOpenTab'）;”，true）;

Answer 2

感谢它与UpdatePanel合作;这是解决方案：

 <div id="accordion-1" class="accordion-section-content">
                 <asp:ScriptManager EnablePartialRendering="true" ID="ScriptManager1" runat="server"></asp:ScriptManager>
                 <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                 <ContentTemplate>
                <table style="width:100%; height: 600px;" border="1">
                <tr>
                <td></td>
                <td><asp:Button ID="btnChercher" runat="server" Text="Chercher" onclick="btn_Chercher"></asp:Button></td>
                </tr>
            <tr>
                <td>
                 Test 1</td>
                <td>
                     <asp:Chart ID="ChartDate" runat=server>
                  <Legends>
                <asp:Legend Alignment="Center" Docking="Top" IsTextAutoFit="False" Name="Default" LegendStyle="Row" />
            </Legends>
                  <Series>
                  <asp:Series Name="Nombre documents"></asp:Series>
                  </Series>
                  <ChartAreas><asp:ChartArea Name="ChartArea1"></asp:ChartArea></ChartAreas>
                  </asp:Chart></td>
            </tr>
            <tr>
                <td>
                    Test 3</td>
                <td>
                     <asp:Chart ID="ChartEtat" runat=server>
                  <Legends>
                <asp:Legend Alignment="Center" Docking="Top" IsTextAutoFit="False" Name="Default" LegendStyle="Row" />
            </Legends>
                  <Series>
                  <asp:Series Name="Etat"></asp:Series>
                  </Series>
                  <ChartAreas><asp:ChartArea Name="ChartAreaHlm"></asp:ChartArea></ChartAreas>
                  </asp:Chart></td>
            </tr>
            <tr>
                <td>
                    Test 5</td>
                <td>
                     <asp:Chart ID="ChartFormulaire" runat=server>
                  <Legends>
                <asp:Legend Alignment="Center" Docking="Top" IsTextAutoFit="False" Name="Default" LegendStyle="Row" />
            </Legends>
                  <Series>
                  <asp:Series Name="Formulaire"></asp:Series>
                  </Series>
                  <ChartAreas><asp:ChartArea Name="ChartAreaFormulaire"></asp:ChartArea></ChartAreas>
                  </asp:Chart></td>
            </tr>
        </table>
        </ContentTemplate>
        </asp:UpdatePanel>
                </div>

谢谢你n0mercy

刷新后让JQuery手风琴保持打开状态

2 个答案: