jquery下拉菜單，切換類

Question

我有一個下拉菜單，並使用jQuery切換類時點擊。 所以當我點擊<a>時，它的父代<li>變成活動的，因此使用css顯示它的子菜單。 我的問題是，RemoveClass這裏的目的是在任何子菜單已經打開的情況下刪除active類。

問題是，當我再次單擊<a>時，它不關閉當前的子菜單，即它似乎沒有切換，只是添加了類。

$("#pop-out-left ul li a").click(function() { 
    $("#pop-out-left ul li").removeClass("active"); 
    $(this).parent().toggleClass("active"); 

    }); 

這裏是CSS ..

#pop-out-left > ul > li.active > a + ul { 
display: block; 
} 

Answer 1

這是因爲你開始對所有li標籤去除active類，使用此代碼：

$("#pop-out-left ul li").removeClass("active"); 

然後當你切換，類再次被添加。這意味着第二次點擊只是重複第一種情況。

爲了解決它，只需修改上面的語句來排除單擊的項目，就像這樣：

$("#pop-out-left ul li a").click(function() { 
    $("#pop-out-left ul li") 
     .not($(this).parent()) 
     .removeClass("active"); 
    $(this).parent().toggleClass("active"); 
}); 

這裏是工作提琴：jsfiddle.net/dDhYu