單擊手風琴菜單中的鏈接時，一旦頁面刷新了新的html內容，如何保持手風琴菜單打開？

Question

導航菜單 - 菜單需要時，頁面被點擊另一個鏈接刷新保持開放

ul class="menu"> 
        <li class="item1"><a href="#">Hardware</a> 
         <ul> 
          <li class="subitem1"><a href="receipt-printer.html">Receipt Printer</a></li> 
          <li class="subitem2"><a href="barcode-scanner.html">Barcode <span class="item-move2">Scanner</span> </a></li> 
          <li class="subitem3"><a href="card-swipes.html">Card Swipes</a></li> 
          <li class="subitem4"><a href="weighscales.html">Weighscales</a></li> 
          <li class="subitem5"><a href="touchscreens.html">Touchscreens</a></li> 
          <li class="subitem6"><a href="label-printer.html">Label Printer</a></li> 
          <li class="subitem7"><a href="customer-display.html">Customer <span class="item-move2"> Display</span></a></li> 
          <li class="subitem8"><a href="wap.html">WAP</a></li> 
         </ul> 
        </li> 
        <li class="item2"><a href="#">Software</a> 
         <ul> 
          <li class="subitem1"><a href="step1/install-ootpik.html">Installing ootpik</a></li> 
          <li class="subitem2"><a href="step1/pref-security.html">Preferences &amp; <span class="item-move2">Security</span></a></li> 
         </ul> 
        </li> 
       </ul> 

菜單 端腳本來操作摺疊式菜單腳本

<!--initiate accordion--> 
<script type="text/javascript"> 
    $(function() { 

     var menu_ul = $('.menu > li > ul'), 
       menu_a = $('.menu > li > a'); 

      menu_ul.hide(); 

     menu_a.click(function(e) { 
      e.preventDefault(); 
      if(!$(this).hasClass('active')) { 
       menu_a.removeClass('active'); 
       menu_ul.filter(':visible').slideUp('normal'); 
       $(this).addClass('active').next().stop(true,true).slideDown('normal'); 
      } else { 
       $(this).removeClass('active'); 
       $(this).next().stop(true,true).slideUp('normal'); 
      } 

     }); 

    }); 
</script> 

末

網站查看手風琴現在： http://www.ootpik.info/lauren/ootpik5/receipt-printer.html

Answer 1

我建議你嘗試另一個菜單選擇器根據你當前的URL（因爲當你的頁面刷新你不能得到菜單項之前點擊）。它可能是這樣的東西（對於receipt-printer.html頁面）：

$('.menu > li > ul:not(:has(li > a[href="receipt-printer.html"]))') 

這是硬編碼，但我認爲它可以爲你工作。 您可以從window.location.pathname獲得當前頁面的值。例如像這樣：

var url = window.location.pathname.split('/')[3] //because on your site you have relative url lauren/ootpik5/receipt-printer.html 

但它也硬編碼，我不知道它會適用於您的網站上的任何網址。

算法如此充滿例子是：

var splittedUrl = window.location.pathname.split('/'); 
var href = splittedUrl[splittedUrl.length - 1]; 
var menu_ul = $('.menu > li > ul:not(:has(li > a[href="' + href + '"]))'); 
munu_ul.hide();