Показать сообщение отдельно
  #1 (permalink)  
Старый 04.12.2015, 13:20
Аватар для fenix_63
Аспирант
Отправить личное сообщение для fenix_63 Посмотреть профиль Найти все сообщения от fenix_63
 
Регистрация: 05.06.2014
Сообщений: 92

Изменение стиля при событии
Всем привет! Народ, как на JS или jQuery сделать рамку у картинки, если к этой картинке привязан RadioButton?

Вот страница
http://hookah-dream.ru/katalog/product/view/20/202.html

надо сделать так, чтобы при клике на картинку, т.е. когда radiobutton выбран у соответствующей картинки - у неё бы появлялся border.

Сам radiobutton я скрыл - для красоты, но вот как сделать выделение пока не знаю. Помогите пожалуйста.

пока есть только вот что:

<span id='block_attr_sel_1'>
					<!--Тут идёт вывод переключателя и картинки-->
                <span class="input_type_radio"><input type="radio" name="jshop_attr_id[1]" id="jshop_attr_id15" value="5" onclick="setAttrValue('1', this.value);"> <label for="jshop_attr_id15"><span class='radio_attr_label'><img src='http://hookah-dream.ru/components/com_jshopping/files/img_attributes/thumb____________________________HG-18______________.jpg' alt='' /> Синяя</span></label></span>
				<span class="input_type_radio"><input type="radio" name="jshop_attr_id[1]" id="jshop_attr_id16" value="6" onclick="setAttrValue('1', this.value);"> 
				<label for="jshop_attr_id16">
				<span class='radio_attr_label'><img src='http://hookah-dream.ru/components/com_jshopping/files/img_attributes/thumb____________________________HG-18______________1.jpg' alt='' /> Белая
				
				</span>
				
				</label>
				</span>
				
				<span class="input_type_radio"><input type="radio" name="jshop_attr_id[1]" id="jshop_attr_id17" value="7" onclick="setAttrValue('1', this.value);"> <label for="jshop_attr_id17">
				
				<span class='radio_attr_label'>
				<img src='http://hookah-dream.ru/components/com_jshopping/files/img_attributes/thumb____________________________HG-18________________________.jpg' alt='' /> Коричневая
				</span>
				
				</label>
				
				</span>
				<span class="input_type_radio"><input type="radio" name="jshop_attr_id[1]" id="jshop_attr_id18" value="8" onclick="setAttrValue('1', this.value);"> <label for="jshop_attr_id18">
				<span class='radio_attr_label'><img src='http://hookah-dream.ru/components/com_jshopping/files/img_attributes/thumb____________________________HG-18________________.jpg' alt='' /> Черная</span>
				</label>
				</span>                
</span>



Код:

$(document).on("change", "input[type=radio]", function(e){
		   if ($(this).prop("checked")) {
				$(".radio_attr_label img").css("border","2px solid #fce;");
			}
			else
			{
				$(".radio_attr_label img").css("border","0px solid #fce;");
			}
		});


Но веб инспектор ругается, пишет
$(...).on is not a function


Помогите знающие люди
Ответить с цитированием