Accordion保持用户点击面板打开

时间:2013-04-16 10:00:45

标签: jquery

当我在菜单中使用jQuery手风琴时,如何在页面刷新时保持用户点击面板打开?当用户点击面板,发送请求并刷新页面时,手风琴总会关闭。

这是我的代码:

$(function(){
     var icons = {
        header: "ui-icon-triangle-1-e",
        activeHeader: "ui-icon-triangle-1-s"
         }

    $("#accordion").accordion({
        heightStyle:"content",
            header:".level21",
    event:"click",
    active:false,
    collapsible:true,
    icons:icons
    });  
 });

1 个答案:

答案 0 :(得分:0)

你应该使用Hidden Fields在回发期间保持手风琴状态。

我不知道您使用的是哪种技术,但对于ASP.net

<asp:HiddenField ID="hidAccordionIndex" runat="server" Value="0" />


<script language="javascript" type="text/javascript">
    $(function(){
        var activeIndex = parseInt($('#<%=hidAccordionIndex.ClientID %>').val());

        $("#accordion").accordion({
            autoHeight:false,
            event:"mousedown",
            active:activeIndex,
            change:function(event, ui)
            {
                var index = $(this).children('h3').index(ui.newHeader);
                $('#<%=hidAccordionIndex.ClientID %>').val(index);
            }
        });
    });
</script>

您可以使用JQuery cookies插件here,然后将其值设置如下

    change: function(event,ui) {
        var hid = ui.newHeader.children('a').attr('id');
    if (hid === undefined) {
        $.cookie('menustate', null);
    } else {
        $.cookie('menustate', hid, { expires: 2 });
    }
}

有用的文章here