如何在頁面導航後跟蹤手風琴（在masterpage中）打開狀態？

Question

我正在使用jQuery手風琴作爲asp.net主頁上的菜單。

這是jQuery的

$(document).ready(function() { 
    $(".header").click(function() { 
     $(this).toggleClass("display"); 
     $(this).next("div .menu_body").slideToggle(500); 
    }); 
}); 

這是HTML。

<div id="MasterPage_Menu" class="menu_list"> 
    <p class="header">Header-1</p> 
    <div class="menu_body"> 
     <a href="page1.aspx">Link-1</a> 
    </div> 
    <p class="header">Header-2</p> 
    <div class="menu_body"> 
     <a href="page2.aspx">Link-2</a> 
    </div> 
    <p class="header">Header-3</p> 
    <div class="menu_body"> 
     <a href="page3.aspx">Link-3</a> 
    </div> 
    </div> 

根據上面的代碼中，當單擊頭時，內容（menu_body）將被滑動肘節。 menu_body在默認情況下隱藏，當用戶點擊標題時，menu_body可見。

例題：如：2 menu_body是可見的，當我點擊HREF =「page1.aspx這個」，該頁面將被導航到page2.aspx但手風琴將返回到默認的是所有的menu_body是隱。

由於我在母版頁中使用了這種手風琴，因此我無法存儲該值，以便在頁面導航時保持手風琴menu_body狀態進入隱藏字段。隱藏字段中的值將被重置。

我在考慮將它存儲在會話中，但在客戶端頁面中，它不允許我們將值存儲到會話中。

任何解決方案？

Answer 1

如果添加id屬性的標題：

<p class="header" id="header-1">Header-1</p> 
    <div class="menu_body"> 
     <a href="page1.aspx">Link-1</a> 
    </div> 

然後你就可以拉id出在你的處理器，並使用jquery.cookie跟蹤cookie中開啓面板：

$(".header").click(function() { 
    var $this = $(this); 
    if(!$this.hasClass('display')) 
     $.cookie('open_panel', this.id); 
    $this.toggleClass("display"); 
    $this.next("div .menu_body").slideToggle(500); 
}); 

你如果您想一次打開多個面板，但需要使用簡單的CSV列表可能就足夠了，那麼需要使用open_panel的存儲格式。我將把這部分作爲讀者的練習。您也希望在頁面加載時檢查cookie並打開相應的面板。

如果您想保留設置作爲用戶帳戶首選項的一部分，您還可以跟蹤服務器上的cookie值。