JQuery: выбор брата

Question

<div id="item">
    <div class="action">
        Oh! Look, a squashed pea!
    </div>
    <img class="picture" src="example">
</div>

Используя jQuery, при наведении курсора на изображение мне нужно DIV с именем класса 'action'.Часть парения у меня есть, и она работает нормально, но я борюсь с селекторной частью.

Я попытался выбрать родителя, а затем брать его с классом 'action' без удачи ...

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

<div id="item"> 
    <div class="action"> 
        <span>Oh! Look, a squashed pea!</span>
        <button id="add">Hello</button>
    </div> 
    <img class="picture" src="example"> 
</div> 

Я все еще послессылка на DIV с классом .action, примененным БЕЗ ссылок на любые идентификаторы.

Answer 1

$("#item img")
    .on("mouseover", function(){
    var prevAction = $(this).prev();
    prevAction
        .css("background-color","red");
});

Мы используем prev(), чтобы выбрать непосредственно предшествующий элемент.(Затем мы установим его цвет фона на красный, но это часть, которую вы меняете).В этом случае элемент, который вы хотите выбрать, сохраняется в переменной prevAction.

РЕДАКТИРОВАТЬ: Для вашего обновления:

$("img.picture")
    .on("mouseover", function(){
    var prevAction = $(this).prev();
    prevAction
        .css("background-color","red");
});

Вместо выбораimage внутри div с идентификатором item, мы выбираем изображение с классом picture.Это может конфликтовать с другими элементами, если у вас есть изображения с таким же классом, кроме этих #item div.В этом случае вы можете , вероятно, сделать селектор более конкретным:

$("div img.picture")

. Это позволит выбрать изображения с классом picture внутри любого элемента div (независимо от идентификатора или класса).).

Answer 2

Вы можете использовать .prev () , чтобы получить предыдущего брата.В пределах вашей функции наведения это будет:

$(this).prev();