Перемещение в jquery через несколько элементов

Question

Так что я пытаюсь пройти через несколько элементов, и у меня, похоже, проблема. У меня есть 2 divs, у которых есть два дочерних элемента каждый - вход и ссылка. Внутри ссылки есть также изображение. Когда я нажимаю кнопку ввода первого div, я хочу, чтобы вы могли перейти к ее родному брату (ссылка {тег}) и в дочерний элемент ссылок (тег img) и получить его исходный атрибут, который я буду использовать для изменения изображения второго div. Вот отрывок кода

HTML:

<div id="item"> 
    <a href="#" target="_blank" id="yeezy"><img src="img/deli/1.jpg" alt="Owl Image" id="homeimage"></a> 
    <input type="submit" id="btn1" class="btn btn-default dropdown-toggle viewbuttons" value="View Item" onclick='changeImage("img/deli/1.jpg");'> 
</div> 
<div class="item"> 
    <a href="#" target="_blank"><img src="img/deli/2.jpg" alt="Owl Image" id="homeimage"></a> 
    <input type="submit" id="btn" class="btn btn-default dropdown-toggle viewbuttons" value="View Item" onclick='changeImage("img/deli/2.jpg");'> 
</div> 

Jquery:

$(document).ready(function(e){ 

    $('input#btn1').on('click', function(){ 

     var changeThis = $('input#btn1').siblings('#yeezy').children('img').attr('src'); 
     $("#homeimage").attr("img", changeThis); 

    }) 

}); 

Спасибо заранее

Answer 1

идентификаторы должны быть уникальными. Селектор ID выбирает только первый соответствующий элемент в документе. Вы получаете/устанавливаете атрибут src одного элемента, то есть оба $('input#btn1').siblings('#yeezy').children('img') и $("#homeimage") относятся к одному и тому же элементу.

Либо использовать разные идентификаторы, либо использовать атрибуты класса. Также обратите внимание, что поскольку идентификаторы должны быть уникальными, $('input#btn1').siblings('#yeezy') не имеет большого смысла. Вы можете просто выбрать элемент с помощью селектора идентификаторов: $('#yeezy');

Answer 2

С кодом есть несколько вещей. Вы дважды используете идентификатор «homeimage», но должен быть только один из заданного идентификатора. У вас есть атрибуты onclick, установленные для другой функции, кроме той, которую вы хотите запустить, поэтому вы должны удалить ее. Наконец, когда вы пытаетесь изменить атрибут src для homeimage, вы вызываете функцию на img attr: ("img", changeThis);

Убедитесь, что все ваши идентификаторы уникальны, удалите любые атрибуты onclick из ваших элементов и затем замените:

$("#homeimage").attr("img", changeThis);

с:

$('#homeimage').attr('src', changeThis);