Удаление класса из UL LI, но не UL LI UL LI с помощью jQuery - PullRequest
0 голосов
/ 06 октября 2011

Я изменяю скрипт аккордеона, чтобы добавить класс active к ссылке, по которой щелкают, но для подпунктов у меня проблема.

По сути, если вы щелкнете по дочернему элементу аккордеона, мне нужно также добавить активный класс, не удаляя его из родительского элемента. Как это

parent-item
parent-item (active)
   sub-item
   sub-item (active)
   sub-item
parent-item
parent-item

Вот немного скрипта на данный момент:

$("#menu li a").removeClass("active");
$(this).addClass("active");

Спасибо, просто оставьте комментарий, если вам нужны разъяснения.

EDIT:

Дочерние элементы технически не являются дочерними элементами одного и того же, поэтому .parent() не будет работать.

<li>
    <a href="#">parent-item</a>
    <ul>
        <li><a href="#">sub-item</a>
    </ul>
</li>

Ответы [ 4 ]

1 голос
/ 06 октября 2011

Вы можете попробовать:

$(this).parent().siblings().children('a').removeClass("active");
$(this).addClass("active");

Это удалит .active на тех же элементах уровня

0 голосов
/ 06 октября 2011

Этот пример, возможно, поможет вам

<ul id='menu'>
<li>
    <a>MElement1</a>
</li>
<li>
     <a>MElement2</a>
 </li>
</ul>
<ul id='menu1'>
<li>
    <a>Element1</a>
</li>
<li>
    <a>Element2</a>
</li>
</ul>

css

.deneme{
    color:red;
}

.deneme1{
color:blue;
}

js

$('#menu').addClass('deneme')
$('#menu1 li a').addClass('deneme1')

$('#menu').live('click',function(){
    $(this).toggleClass('deneme')
})
$('#menu1 li a').live('click',function(){
    $(this).toggleClass('deneme1')
})

, и вы можете проверить здесь http://jsfiddle.net/h7fvW/

0 голосов
/ 06 октября 2011

Что-то вроде:

$("#menu > ul").removeClass("active");
$(this).parent("li").parent("ul").addClass("active");

Следует добавить активный класс к соответствующему родительскому элементу.

0 голосов
/ 06 октября 2011

Вы имеете в виду что-то вроде этого?

$("#menu li a").removeClass("active");
$(this).addClass("active");
$(this).parent().addClass("active");

После удаления активного класса просто добавьте его обратно к выбранному элементу и его родителю.

РЕДАКТИРОВАТЬ: Глядяв вашем HTML-фрагменте вы должны быть в состоянии подняться обратно так далеко, как вам нужно, а затем вернуться обратно.например,

$("#menu li a").removeClass("active");
$(this).addClass("active");
$(this).parent().parent().children("a").addClass("active");
...