jQuery parent ()

Question

jQuery фрагмент:

$(".sliders dt a").click(function(){
    $(this).parent().parent().parent().find(".triggers a").removeClass("active");
    $(this).toggleClass("active");
    $(this).parent().next("dd").slideToggle("fast");
    return false
});

HTML:

<div class="sliders">
    <div class="triggers">
       <a href="#" class="active">Hide all</a>
    </div>
    <dl>
        <dt>
            <a href="#">text</a>
        </dt>
        <dd>text</dd>
    </dl>
</div>

Три .parent() используется, чтобы поймать .triggersблок. Есть ли способ объединить их?

---

jQuery 1.2.6.используется версия, поэтому .closest() решения не работают.

Answer 1

Вы можете использовать .closest() следующим образом:

$(".sliders dt a").click(function(){
    $(this).closest(".sliders").find(".triggers a").removeClass("active");
    return false
}); 

Это поднимается до .sliders div, а затем обратно вниз, чтобы найти .triggers a ниже.

Answer 2

Как работает родители ()? Он идет по дереву DOM и собирает всех родителей. Затем он фильтрует их по указанному селектору.

При использовании jQuery 1.4+ более оптимальным является использование .closest (). Это будет работать намного быстрее, если на вашей странице будет много узлов. Просто мысль.

..

$ (это) .closest ( ' ') ползунки братьев и сестер ('. ') триггеры найти (' а') removeClass (...).

Answer 3

Поскольку .sliders и .triggers являются братьями и сестрами, вам необходимо использовать .closest(), чтобы получить .sliders, затем перейти к .triggers и получить его внутренний элемент a.

$(".sliders dt a").click(function(){
    $(this).closest('.sliders').prev('.triggers').find("a.active").removeClass("active");
    return false;
});

---

EDIT:

Вопрос изменился, теперь ответ изменился:

$(".sliders dt a").click(function(){
    $(this).closest('.sliders').find(".triggers a.active").removeClass("active");
    return false;
});