หีบเพลง Jquery เก็บสถานะไว้ในเมนูสำหรับลิงก์ที่ไม่อยู่ในเมนู

ฉันกำลังต่อสู้เพื่อให้ได้หีบเพลงเพื่อคงสถานะของลิงก์ที่ไม่ได้อยู่ในเมนูหีบเพลงและสงสัยว่าเป็นไปได้หรือไม่ ฉันใช้ jquery-1.6.2.min.js + query-ui-1.8.14 กำหนดเอง min.js

ฉันได้สร้างเมนูซึ่งมี 3 ระดับ ฉันไม่มีปัญหาในการรักษาสถานะไว้ที่นี่ แต่ฉันสงสัยว่าจะรักษาสถานะของ URL ที่ไม่มีอยู่ในเมนูได้อย่างไร ตัวอย่างเช่น ถ้าฉันคลิกที่ 'ขั้นสูง' (โค้ด html ด้านล่าง) มันจะแสดงเมนูหีบเพลงและรายการเมนูที่เลือกอย่างถูกต้อง อย่างไรก็ตาม หน้า 'ขั้นสูง' นี้มีหน้าแยกกันตามมา ตอนนี้ แนวคิดของฉันคือว่าหากมีการคลิกหน้าใดหน้าหนึ่งต่อไปนี้ ลิงก์ 'ขั้นสูง' ในเมนูหีบเพลงก็ควรจะเลือกไว้ และ 'ขั้นสูง' จะยังคงแสดงต่อไป

ฉันรวบรวมมาว่าวิธีเดียวที่จะทำสิ่งนี้ได้คือการใช้ jquery.cookie และหากมีการคลิก URL ของเมนู คุกกี้ก็จะได้รับการอัปเดตด้วย URL ของรายการเมนู หากมีการคลิก URL ซึ่งไม่ได้อยู่ในเมนู คุกกี้จะไม่ได้รับการอัปเดต แต่รายการเมนูดั้งเดิมจะยังคงแสดงอยู่ อย่างไรก็ตาม ฉันไม่สามารถทำงานนี้ได้

ฉันได้ใช้ NavigationFilter ภายในฟังก์ชันหีบเพลงและวิธีอื่นๆ มากมายแต่ก็ไม่มีโชค

เมนู html มีลักษณะดังนี้:

<div class="submenu">
 <ul id="accordion">
  <h3 class="h3"><a href="/th#">System Setup</a></h3> 
   <div> 
     <ul id="accordion-syssetup"> 
      <!-- System setup menu --> 
      <li> 
        <a href="/th#" class="accheader">Setup</a> 
        <ul> 
          <li><a  href="/th/advanced.php">Advanced</a></li> 
          <li><a  href="/th/general.php">General</a></li> 
        </ul> 
      </li> 
      <li> 
        <a  href="/th#" class="accheader">Tools</a> 
        <ul> 
          <li><a  href="/th/nslookup.php">Nslookup</a></li> 
          <li><a  href="/th/ping.php">Ping</a></li> 
        </ul>
      </li> 
      <li> 
       <a  href="/th/system_hosts.php">Hosts</a> 
      </li> 
     </ul> 
   </div> 

<h3 class="h3"><a href="/th#">Security</a></h3> 
 <div> 
  <ul id="accordion-security"> 
  <!-- Security menu --> 
   <li> 
    <a  href="/th#" class="accheader">User Management</a> 
    <ul> 
     <li><a  href="/th/user.php">Users</a></li> 
     <li><a  href="/th/groups.php">Groups</a></li> 
    </ul> 
   </li> 
   <li><a  href="/th/certs.php">Certificates</a></li> 
  </ul> 
 </div>
</div>

jquery เป็นดังนี้:

var $j = jQuery.noConflict();
$j().ready(
    function(){

            // Set the cookie
            var currentURL = window.location.toString().split("/");
            var currentURL = currentURL[currentURL.length-1];
            if ($j.cookie('menu') == null) {
                    $j.cookie('menu', currentURL, { expires: null, path: '/'} );
            }
            var menucookie = $j.cookie('menu');

            // Top level
            $j("#accordion").accordion({
                    header: 'h3.h3',
                    autoHeight: false,
                    navigation: true,
                    collapsible: true,
                    alwaysOpen: false,
                    active: false
            });
            // Second level
             $j("#accordion-syssetup").accordion({
                    header: "a.accheader",
                    navigation: true,
                    clearStyle: true,
                    autoHeight: false,
                    collapsible: true,
                    alwaysOpen: false,
                    animated: 'slide'
             });
            $j("#accordion-security").accordion({
                    header: "a.accheader",
                    navigation: true,
                    clearStyle: true,
                    autoHeight: false,
                    collapsible: true,
                    alwaysOpen: false,
                    animated: 'slide'
            });

            $j("#accordion").addClass("ui-widget ui-helper-reset");
            $j("#accordion").removeClass("ui-accordion").find('h3.h3').removeClass("ui-accordion-header");


            var currentURL = window.location.toString().split("/");
            var currentURL = currentURL[currentURL.length-1];
            if (!currentURL || currentURL == '') {
                currentURL = 'index.php';
            }
            $j("#accordion:has(a)").each ( function () {
                    if ( currentURL ) {
                            $j('a[href$="' + currentURL + '"]').addClass("sb-menu-active");
                    }
            });


            // Keep track of the cookie
            $j("#accordion a").each ( function () {
                    url = this.toString().split("/");
                    url = url[url.length-1];
                    if($j('a[href$="' + url + '"]').hasClass("sb-menu-active") == true) {
                            hasclass = true;
                            $j.cookie('menu', currentURL, { expires: null, path: '/'} );
                            menucookie = $j.cookie('menu');
                            return false;
                    }
            });

            // Display the menu
            $j(".submenu").show();
    }
);

คุณจะสังเกตเห็นข้างต้นว่าฉันยังเพิ่มและลบคลาสบางคลาสด้วยเหตุผลด้านความสวยงาม ฉันยังเพิ่มคลาสสำหรับลิงค์เมนูที่ใช้งานอยู่ ฉันได้ลบ NavigationFilter ออกจากด้านบนแล้ว แต่ฉันลองทำสิ่งต่อไปนี้:

navigationFilter: function () {
 //Accordion NavigationFilter
 var locationHrefArray = location.href.split("/");
 var locationLastString = locationHrefArray[locationHrefArray.length - 1].toLowerCase();


 if ( this.href.toLowerCase() == locationLastString ) {
  return true;
 } else if (locationLastString.match( menucookie )) {
  return true;
 } else {
  return this.href.toLowerCase() == location.href.toLowerCase();
 }
}

ฉันรวบรวมค่าที่ส่งคืนจริงเมื่อการจับคู่เมนูคุกกี้ไม่ถูกต้อง แต่ฉันไม่แน่ใจว่าต้องทำอย่างไรอีก คุณมีข้อเสนอแนะใด? ฉันเป็นคน n00b ดังนั้นฉันอาจจะทุกอย่างไม่ถูกต้อง

ขอบคุณ