Событие jquery radio checked + img src replace
Отзывы ()
Теги:
Рекомендуйте нас:
Динамика курса Гривна ЦБ РФ, руб. за 10 грн
12.07.2011
Отчего скачут цены на различных биржах продажи ссылок, можно узнать из этого графика
Главная -
24.04.2014
Нужно было сделать "переключалку" картинки, при выборе определенных radio элемента. Получилось сделать это используя библиотеку jquery-1.10.1.js
Так это работает:
Исходный код HMTL выглядит так:
<img class="imgswitch802" src="http://coffee911.com.ua/assets/cache/images/2014/zernovoy/120x90-Covim-Orocrema.665.jpg" />
<div class="optcena"> <div> <input type="radio" onclick="jQuery.additOpt(this)" checked="checked" id="optcena8020" value="0__145" name="optcena__802" class="addparam"> <label for="optcena8020">1 кг (145 грн/кг)</label></div> <div><input type="radio" onclick="jQuery.additOpt(this)" id="optcena8021" value="1__750" name="optcena__802" class="addparam"> <label for="optcena8021">6 кг (125 грн/кг)</label></div> </div>
А так выглядит исходный javascript код
$rozn = 'http://coffee911.com.ua/assets/cache/images/2014/zernovoy/120x90-Covim-Orocrema.665.jpg'; $opt = 'http://coffee911.com.ua/assets/cache/images/assets/snippets/phpthumb/120x90-noimage-box.665.jpg'; $( "#optcena8020" ).on( "click", function() { $('.imgswitch802').attr('src', $rozn); }); $( "#optcena8021" ).on( "click", function() { $('.imgswitch802').attr('src', $opt); });
Исходник можно посмотреть тут: http://jsfiddle.net/waGdZ/235/