Есть свойства товара ( размеры, цвет...) в каждом есть параметры ( под тегами <li>)
<ul class="ul-parametr"><strong>
<li class="parametr par0 0 0 0 "><a href="#">10</a></li>
<li class="parametr par0 0 0 1 "><a href="#">12</a></li>
<li class="parametr par0 0 0 2 "><a href="#">14</a></li>
<li class="parametr par0 0 0 3 "><a href="#">16</a></li> </strong></ul>
......
......
<ul class="ul-parametr"><strong>
<li сlass="parametr par1 1 1 0 "><a href="#">белый</a></li>
<li class="parametr par1 1 1 1 "><a href="#">черный</a></li>
<li class="parametr par1 1 1 2 "><a href="#">синий</a></li> </strong></ul>
Свойств может быть как два так и три,так и одно. Я их вывожу из БД и присваиваю им такие классы, чтобы отличать.
Далее нажимаю на первый ряд переменных ( выбираю размер) , и это значение должно прописаться в кнопки "ДОБАВИТЬ", в атрибутах или классе, чтобы потом смог передать его в обработчик.
Далее нажимаю на второй ряд переменных ( выбираю цвет) , и это значение должно прописаться в кнопки "ДОБАВИТЬ", в атрибутах или классе, чтобы потом смог передать его в обработчик.
И так нажимаю по всем свойствам. Если свойств два- то при выборе второго - должна активироваться кнопка ДОБАВИТЬ ( с уже прописанными в ней параметрами, для передачи в обработчик)
часть кода js что-то вроде этого:
$(".parametr").click(function(){
arr = $(this).attr('class').split( " " );
fff="."+arr[1];
ddd=arr[1];
ggg=arr[1];
$(fff).css("background-color","#ffffff");
$(this).css("background-color","#0080ff");
$(".add-cart-style").attr( ddd , arr[2] );
??????
??????
??????
});