Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   вывести картинку или цвет в div в зависимости от выбранного span (https://javascript.ru/forum/dom-window/57843-vyvesti-kartinku-ili-cvet-v-div-v-zavisimosti-ot-vybrannogo-span.html)

todayz 22.08.2015 20:47

вывести картинку или цвет в div в зависимости от выбранного span
 
Доброго времени суток. Прошу меня извинить, если вопрос будет тупой. Я к сожалению плохо разбираюсь в JS, но мне понадобилась одна функция.

У меня на странице выводится 75 цветов и 22 узора для товара. Каждое значение заключено в span. Вот пример для цвета.

<a class="va-picker va-picker-color" data-attribute="pa_color" data-term="flamenko" title="Flamenko"><span class="va-picker-item va-color" style="background-color: ##ee7222;background-color: rgba(238, 114, 34, 1.00);"></span></a>
	<span class="va-picker-item va-color" style="background-color: ##ee7222;background-color: rgba(238, 114, 34, 1.00);"></span>
</a>


и пример для узора

<a class="va-picker va-picker-image" data-attribute="pa_pattern" data-term="black-elements" title="Black Elements"><img class="va-picker-item va-image" src="http://site.local/wp-content/uploads/2015/08/Black-Elements-150x150.jpg" alt="black-elements"></a>
	<img class="va-picker-item va-image" src="http://site.local/wp-content/uploads/2015/08/Black-Elements-150x150.jpg" alt="black-elements">
</a>


и мне нужно в зависимости от того, какой из 75 цветов и 22 узоров выбран вывести это в 2 отельных div элемента. Чтобы было нагдядно понятно какая цветовая комбинация выбрана клиентом.

Буду очень признателен за любую помощь.

Accami 23.08.2015 14:21

Спасибо !

todayz 25.08.2015 23:58

Ок, тишина это хорошо, но может кто подскажет что-то...

я упростил задачу для себя. несколько дней ковырял js и вот что получилось

<script type="text/javascript" src="http://yandex.st/jquery/1.7.2/jquery.min.js"></script>
<span class="va-picker-item va-color" style="background-color:#ffffff;">ffffff</span> 
<span class="va-picker-item va-color" style="background-color:#fff000;">fff000</span>
<span class="va-picker-item va-color" style="background-color:#ffe813;background-color: rgba(255, 232, 19, 1.00);">ffe813</span>

<script type="text/javascript">
$('.va-color').live('click', function()
	{
         alert($(this).attr("style"));
	}
);
</script>


В таком виде при клике на span я получаю alert c содержанием значения style. Но он в виде: background-color:#ffffff;
А вот как добраться только до hex значения background-color?

рони 26.08.2015 01:24

todayz,
$(this).text() или
$(this).css('background-color');
и взять новее jquery и забыть про live - заменить на on
и зачем
Цитата:

Сообщение от todayz
background-color:#ffe813;background-color

два раза???

todayz 26.08.2015 13:10

Я уже реализовал то что мне было нужно на jquery.

background-color:#ffe813;background-color

это сторонний скрипт такое выдаёт. я его всего лишь обрабатываю


Часовой пояс GMT +3, время: 22:54.