jQuery несколько фонов из щелкнутых элементов

Question

У меня возникли проблемы с тем, чтобы это работало. В настоящее время я работаю над проектом eCommerce на странице продукта. На этой странице у меня есть основной образ продукта и два дополнительных ряда изображений, из которых пользователь может выбрать, чтобы он мог просматривать основное изображение с разными фонами.

Как это работает, мне нужно получить #actual_image_url (который является фактическим размером фотографии, которую мне нужно наложить) и либо добавить его с использованием нескольких фонов, либо с помощью innerHTML, добавив его в div основного изображения ,

В принципе, я добавил до сих пор слушателя событий для события click на этом DIV, и я экспериментировал с нажатием атрибута data-target в массиве. Я подумал, могу ли я сохранить фактические URL-адреса целевых данных в массиве и выпустить последние два, которые должны это сделать. Он не сделал, поэтому я прошу помощи :)

<div class="image_options"> 

<!-- first row of images --> 
<a href="#"><img src="#small_image_url" id="option-value-47" data-target="#actual_image_url"></a> 
<a href="#"><img src="#small_image_url" id="option-value-48" data-target="#actual_image_url"></a> 

<!-- second row of images --> 

<a href="#"><img src="#small_image_url" id="option-value-147" data-target="#actual_image_url"></a> 
<a href="#"><img src="#small_image_url" id="option-value-148" data-target="#actual_image_url"></a> 

</div> 

JQuery кода до сих пор:

var contentImageUrl = []; 
$(selector).on("click", function(event) {  
      event.preventDefault();  
      contentImageUrl.push(event.srcElement.getAttribute('data-target')); 

Пользователь должен быть нажав на любой из двух вторых рядов фотографий, так что мне нужно атрибут данных для обоих из них. Мне также нужен способ добавить их в качестве фонов на основное изображение после того, как я получил URL-адрес «target-target».

, пожалуйста, помогите ребятам!

Answer 1

Вы ищете jQuery.data(): http://api.jquery.com/jquery.data/

Кроме того, вы можете использовать $ (это), чтобы обратиться к элементу, который был щелкнули.

contentImageUrl.push($(this).data("target"));