ツリーメニューのステータスを保存するようにCookieを設定し、ページが読み込まれたときにCookieを読み直します。
メニューのHTML構造：
<div> <ul> <li> <a href = "＃" id = "treemenu_a_1">ファーストレベルメニュー1 </a> <div id = "submenu_1"> <ul> <li> <a href = "subpage/a.html" id = "submenu_a_1_1" href = "subpage/b.html" id = "submenu_a_1_2">セカンドレベルのメニュー2 </a> </li> <li> <a href = "＃" id = "submenu_a_1_3">セカンドレベルメニュー3 < 4 </a> </li> <li> <a href = "＃" id = "submenu_a_1_5">セカンドレベルのメニュー5 </a> </li> </ul> </ul> </div> <li> <a href = "＃"＃ "＃" id = "treemenu_a_2">ファーストレベルメニュー2 href = "＃" id = "submenu_a_2_1">セカンドレベルメニュー1 </a> </li> <li> <a href = "＃" id = "submenu_a_2_1_1">セカンドレベルメニュー1 </a> </a> </li> <li> <a href = " 1 </a> </li> <li> <a href = "＃" id = "submenu_a_2_1_2">セカンドレベルのメニュー2 </a> </li> <li> <a href = "＃" id = "submenu_a_2_1_3">レベル3メニュー3 </a> href = "＃" id = "submenu_a_2_1_3_1">レベル4メニュー1 </a> </a> </li> <li> <a href = "＃" "＃" "id =" submenu_a_2_1_3_2 ">レベル4メニュー2 </a> </li> <li> <a href =" 3 </a> </li> </ul> </div> </li> <li> <a href = "＃" id = "submenu_a_2_2">セカンドレベルメニュー2 </a> </li> <li> <a href = "＃" id = "submenu_a_2_3" id = "submenu_a_2_4">セカンドレベルのメニュー4 </a> </li> <li> <a href = "＃" id = "submenu_a_2_5">セカンドレベルメニュー5 </a> </li> </ul> </li> <li> <a href = "＃" id = "treemenu_a_3" second-level " id = "submenu_3"> <ul> <li> <a href = "＃" id = "submenu_a_3_1">セカンドレベルメニュー1 </a> </li> <li> <a href = "＃" id = "submenu_a_3_2">セカンドレベルメニュー2 </a> </li> < id = "submenu_a_3_3">セカンドレベルのメニュー3 </a> </li> <li> <a href = "＃" submenu_a_3_4 ">セカンドレベルメニュー4 </a> </li> <li> <a href ="＃ "＃" id = "submenu_a_3_5"> second-level Menu 5 </a> </li> </ul> </div> </li> </ul> </div>
クッキーツールクラスを読む：
// Cookie Tool class var cookietool = {// cookiegetcookie：function（c_name）{if（document.cookie.length> 0）{c_start = document.cookie.indexof（c_name + "="）; if（c_start！= -1）{c_start = c_start + C_Name. document.cookie.indexof（ ";"、c_start）; if（c_end == -1）{c_end = document.cookie.length;} return unescape（document.cookie.substring（c_start、c_end））;}} return "";} date（）; exdate.setdate（exdate.getDate（） + expireds）; // document.cookie = c_name + "=" + escape（value） +（（expedays == null）？ ""： "; expires =" + exdate.togmtstring（）;}、// cookiedelcookie：function（c_name）{var exdate = new date（）; exdate（ //昨日の日付document.cookie = c_name + "=; expires =" + exdate.togmtstring（）;}};メニューイベントバインディング：
//メニューイベントバインディング$（'。treemenua '）。bind（' click '、function（）{var $ this = $（this）; var id = $ this.attr（' id '）; var $ submenu = $ this.next（'。submenu'）; if（$ submenu.length> 0）{// $（this）.next（ '。submenu：hidden'）。 cookietool.getcookie（id）; $（ '。treemenu'）。find（ '。on'）。 cookietool.delcookie（$（this）.attr（ 'id'））;ページが読み込まれたときにメニューをリセットします
//ページの読み取りcookies $（'。treemenua '） （$ this.next（'。submenu '）。length> 0）{$ this.next（'。submenu'）。css（ 'display'、cookie）;} else {$（ '＃' + cookie）.addclass（ 'on'）;}}}}}}完全なデモ：
【javascript】unchangedツリーメニュー（マルチレベルメニュー）.zipを更新します
注：ローカルクロムコンソールはCookieを読み取ることができず、Firefox/IEまたはサーバー環境でテストする必要があります