2012-01-11 68 views
1

上保持狀態退房處理菜單上this網站的右側。它有一個<a>標籤一套<dt>標籤和子菜單的<ul>列表裏面<li>鏈接。頂級鏈接和sumbmenu鏈接使用rel屬性組合在一起。遇到問題定製的jQuery菜單

正如你可以看到子滑下當您單擊頂級鏈接。我想要做的是在頁面加載之間保持狀態,以便如果子菜單中的任何鏈接被點擊,它將保持打開狀態。我正在嘗試使用rel屬性來執行此操作。

這裏是我的代碼,到目前爲止,我得到一個有點困惑與邏輯:

function initMenu() { 
    $('.menu ul:not(.active)').hide(); 

    var checkCookie = $.cookie("nav-item"); 
    if (checkCookie != "") { 
     $('.menu').each(function() { 
      var state = $(this).find('a:first-child').attr('rel'); 
      if (state == checkCookie) { 
       alert(state); 
       $(this).next().slideToggle('normal');  
      } 
     })  
    } 

    $('.menu > a:first-child').click(function(e) { 
     e.preventDefault(); 
     var navIndex = $(this).attr('rel'); 
     $.cookie("nav-item", navIndex); 

     $(this).next().slideToggle('normal'); 
    }); 
} 

$(function() { 
    initMenu(); 
}); 

編輯** 我已經改變了代碼的第一部分,這個以嘗試並使用活躍的班級。但是它所做的是打開所有的ul,而不是隻包含與活動類的li的ul。

$('.menu ul:not(.active)').hide(); 

$('.menu').each(function(){ 

    if ($(this).children(".active")){ 

     $(this).children('ul').slideToggle('normal'); 
    } 


});  
+0

請在這裏發表您樣品的標記,否則一旦出問題的解決了這個問題不再是利用別人可能共享您的問題。 – 2012-01-11 12:11:18

+0

我沒有看到類「菜單」的任何dom元素 - 你可能想要#menu,但是然後你想要#menu> li> a而不是我認爲 – 2012-01-11 12:16:29

+1

創建一個jsfiddle與所需的CSS,HTML和JS可能會其他用戶更容易嘗試和幫助您。 – 2012-01-11 12:17:01

回答

0

更新 * 原來的問題 *

使用的if

if ($(this).find(".active").length){ 
     $(this).children('ul').slideToggle('normal'); 
    } 

原來的答覆

的更新後

有一件事是

if (state == checkCookie) { 
    alert(state); 
    $(this).next().slideToggle('normal');  
} 

this在這種情況下是指.menu而不是a鏈接。

您應將其更改爲

if (state == checkCookie) { 
    alert(state); 
    $(this).children('ul').slideToggle('normal');  
} 

另一種是該Cookie插件創建(默認)屬於創建它們的頁面餅乾。所以當你改變一個頁面時,它不能訪問另一個頁面創建的cookie。

使用the path option節省$.cookie("nav-item", navIndex, {path: '/'});


正確的方法

這將是最好的,雖然不依賴於cookie進行導航,因爲它會成爲問題,當用戶開始使用後退按鈕時..

你應該真的把rel的值作爲散列#relvalue傳遞給url,並用它代替。
提示:退房window.location.hash

+0

謝謝,可能有另一種方法做到這一點,因爲當顯示鏈接頁面時,子菜單鏈接被賦予class =「active」,我可能會使用它來保持父ul打開。 – user794846 2012-01-11 13:16:03

+0

@ user794846的確如此,如果已經有了一個標識主動節點的條款,那將是最好的。 – 2012-01-11 13:39:40

+0

我已經將第一部分的代碼更改爲以下內容,但是它的做法是打開所有ul的代碼只是打開包含課程的那個。請參閱原始問題中的編輯。 – user794846 2012-01-11 14:34:00