Блог

Главная - Вопросы по программированию - jquery siblings removeclass

jquery siblings removeclass

#jquery

#jquery

Вопрос:

Переключение классов работает отлично, но братья и сестры нет.
Я что-то пропустил, и класс «corrente» не удаляется, если я нажму на другую кнопку h1.

Структурный код:

 $(document).ready(function(){
    $("ul.box").addClass(" invisivel");
    $("#menu a").click(function(){
        $(this).next("ul.box")
            .slideToggle("slow")
            .siblings("ul.box:visible")
            .slideUp("slow");
        $(this).children("h1")
            .toggleClass("corrente")
            .siblings("h1")
            .removeClass("corrente");
        return false;
    });
});

Html-код:

 <div id="menu">
    <a href="">
        <h1 class="link-titulo">Oficina da África</h1>
    </a>
    <ul class="box">
        <li>xxx</li>
    </ul>
    <a href="">
        <h1 class="link-titulo">Calendário/Currículo</h1>
    </a>
    <ul class="box">
        <li>xxx</li>
    </ul>
</div>

Комментарии:

1. $(this).children("h1").toggleClass("corrente") .end().siblings("h1").removeClass("corrente");

2. без соответствующего html мы не сможем вам помочь

Ответ №1:

После вызова .children() вы теперь работаете с этим новым набором элементов, поэтому .siblings() затем вызывающий получает доступ к братьям и сестрам дочерних элементов. Вы можете использовать jQuery.fn.end() , чтобы вернуться к предыдущему набору:

 $(this).children("h1").toggleClass("corrente")
.end() // <--
.siblings("h1").removeClass("corrente");

Комментарии:

1. Подумайте: это правильно, что у a h1 будет другой h1 брат или сестра.

2. Но тогда код был бы очень странным: .children('h1') уже имеет все элементы «h1» этого родительского элемента, .siblings('h1') что привело бы к набору точно таких же элементов.

Ответ №2:

попробуйте это и, если возможно, добавьте ваш HTML-код

 $(document).ready(function(){

     $("ul.box").addClass(" invisivel");
$('#menu a').each(function() {
 $(this).click(function() { 
    $(this).next("ul.box").slideToggle("slow")
    .siblings("ul.box:visible").slideUp("slow");
    $(this).children("h1").toggleClass("corrente")
    .siblings("h1").removeClass("corrente");
    return false;
});

});
});

Ответ №3:

Попробуйте заменить

 .siblings("h1").removeClass("corrente");

с

 .next("h1").removeClass("corrente");