JQuery - Как вы выбираете детей детей, когда в контексте «это»? - PullRequest
Новая
       26

JQuery - Как вы выбираете детей детей, когда в контексте «это»?

1 голос
/ 28 июля 2010

При наложении div-обертки мне нужно, чтобы разные вложенные дети делали разные вещи.

Один div должен исчезнуть до одного уровня непрозрачности, другой div должен сделать другое.

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

Я понятия не имею, как называть детей детьми .... Я попробовал каждую комбинацию Фриккина изjQuery, но он просто не хочет воспроизводиться, потому что он цепляется за часть «this» функции.

Но если я уберу «this», он выполнит действие для всех экземпляров в документе.

<div class="vpMedia"><li><a href="http://site.com"><div class="vpArrow"><image src="http://site.com/image1"></div><div class="vpLeft">Title</div><div class="vpRight">
<div class="vpRightImg"><image src="http://site.com/image2"></div></div></a></li></div>

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

this.children(.foo).children(#bar)

Или, может быть, по этому маршруту? 

this > .foo > #bar

Поскольку это никогда не сработает, «this» должно быть out кавычек.Итак, каково решение, если мы не можем использовать em?

Правка - ОК, так что это действительно новый вопрос.Извините, надеюсь, поможет новичку где-то там.Спасибо за ваше терпение.

Ответы [ 4 ]

2 голосов
/ 28 июля 2010

Вам нужно сделать .children('.vpLeft'), а не .children('vpLeft').Вы выбираете элемент, имя узла которого === vpLeft. 

$("div .vpMedia").mouseover(function() {
    $(this).children("li").children("a").children(".vpLeft").animate({opacity: .3}, { duration: 100, queue: false });
}).mouseout(function() {
    $(this).children("li").children("a").children(".vpLeft").animate({opacity: 1}, { duration: 100, queue: false });
})

Вы можете сократить его .. 

$("div .vpMedia").mouseover(function() {
    $('>li>a>.vpLeft', this).animate({opacity: .3}, { duration: 100, queue: false });
}).mouseout(function() {
    $('>li>a>.vpLeft', this).animate({opacity: 1}, { duration: 100, queue: false });
})

Также это <img>, а не <image>

2 голосов
/ 28 июля 2010

Пробовал $(".foo>#bar", this) или $(this).children('.foo').children('#bar')?

Кроме того, помните, что юридически идентификаторы должны быть уникальными на странице, поэтому этот пример можно записать просто $('#bar') ...

1 голос
/ 28 июля 2010

Для вызова детей детей можно сделать: 

$(this).children(".foo").children("#bar");

или вы можете использовать find, что похоже на children, за исключением того, что рекурсивно сканирует DOM . 

$(this).find("#bar");
0 голосов
/ 28 июля 2010

Я верю, что $ (this) .find () будет работать для этого.

Проверьте http://api.jquery.com/find/ для получения дополнительной информации о находке.

...