jQuery - при нажатии на ссылку --> переключать только div, найденный под ссылкой, которая вызвала событие

Мое приложение программно генерирует такой HTML-код:

<div class="container">
<div class="class1">
<a href="#" class="my-link">some link text 1</a>
</div>
<div class="class2">
some content 1
</div>
</div>

<div class="container">
<div class="class1">
<a href="#" class="my-link">some link text 2</a>
</div>
<div class="class2">
some content 2
</div>
</div>
.........
over and over again

Используя jQuery, когда я нажимаю на любую ссылку (внутри <div class="class1"> ), я хочу переключить только <div class="class2">, найденный по этой ссылке, которая вызвала событие.

Как видите, имена классов повторяются снова и снова для каждого «контейнерного» блока div.

Любая идея, как это сделать? Благодарю вас!


jquery javascript-framework jquery-selectors
person avatar    schedule 06.04.2011    source источник

Ответы (4)


arrow_upward
2
arrow_downward

Вы могли бы сделать что-то вроде этого.

$(".my-link").click(function(){
    $(this).closest("div").next(".class2").toggle();
});
person Sang Suantak    schedule 06.04.2011
comment
Это сработало! До этого я пробовал что-то вроде: $(this).closest(.class2).toggle(); и, видимо, не работал. Просто чтобы узнать что-то из этого, почему, выполнив: $(this).closest(div).next(.class2).toggle(); работает и: $(this).closest(.class2).toggle(); нет? Я ценю ваше время! - person avatar; 06.04.2011
comment
@itgorilla - это потому, что .closest проходит вверх по дереву домов, а не вниз. - person Sang Suantak; 06.04.2011
comment
Это имеет смысл. Спасибо много! - person avatar; 06.04.2011

arrow_upward
0
arrow_downward

Селектор «следующий» jQuery возвращает следующий родственный элемент.

$('.class1').click(function(e) {
  $(this).next().toggle();
});
person Peter J    schedule 06.04.2011

arrow_upward
0
arrow_downward

Попробуй это:

$(function(){
 $(".my-link").click(function(){
  $(this).parent().next(".class2").toggle();
 });
});
person Chandu    schedule 06.04.2011

arrow_upward

arrow_downward

person    schedule
comment
+1. В качестве альтернативы $(".class2", $(this).parents(".container")).toggle();. - person Tomalak; 06.04.2011
comment
мне нравится этот лайнер. +1 и вам, сэр - person corroded; 06.04.2011