Смена атрибута при выборе из выпадающего списка

[spro1]

Здравствуйте!

есть:
выпадающий список

<select id="spisok" class="spisok" data-tooltip="" data-load-state="" style="" title="" size="" name="spisok">
<option selected="selected" value="Значение 1" >Значение 1</option>
<option value="Значение 2">Значение 2</option>
</select>

и див с картинкой
<div id=img><img src=/image.jpg></div>
задача при выборе значения из списка сменить путь к картинке

сделал так:

<script>
var spisok = $("#spisok").val()
function changimg(){
if(spisok == "Значение 2")
      {
        $("#img img").attr("src", "/image2.jpg");     
      }
}
</script>

я плохо знаю jquery и видимо в чем то ошибся, но не могу понять почему не работает. Подскажите, что не так делаю?

 

[ZiX]

Здравствуйте!

есть:
выпадающий список

<select id="spisok" class="spisok" data-tooltip="" data-load-state="" style="" title="" size="" name="spisok">
<option selected="selected" value="Значение 1</option>
<option value="Значение 2</option>
</select>

и див с картинкой
<div id=img><img src=/image.jpg></div>
задача при выборе значения из списка сменить путь к картинке

сделал так:

<script>
var spisok = $("#spisok").val()
function changimg(){
if(spisok == "Значение 2")
      {
        $("#img img").attr("src", "/image2.jpg");     
      }
}
</script>

я плохо знаю jquery и видимо в чем то ошибся, но не могу понять почему не работает. Подскажите, что не так делаю?

<script>
function changimg(){
var spisok = $("#spisok").val()
if(spisok == "Значение 2")
      {
        $("#img img").attr("src", "/image2.jpg");     
      }
}
</script>

вот так верно.

 

[spro1]

очень странно, но не работает

 

[ZiX]

очень странно, но не работает

ты функцию то как вызываешь?
Вот рабочий вариант. вам не только js но html подучить бы...
Для просмотра ссылки Войди или Зарегистрируйся

 

[spro1]

<script>
$('#spisok > option').bind('click', function(){
function changimg(){
var spisok = $("#spisok").val()
if(spisok == "Значение 2")
      {
        $("#img img").attr("src", "/image2.jpg");    
      }
}
});
</script>

 

[ZiX]

<script>
$('#spisok > option').bind('click', function(){
function changimg(){
var spisok = $("#spisok").val()
if(spisok == "Значение 2")
      {
        $("#img img").attr("src", "/image2.jpg");   
      }
}
});
</script>

смотрите Вот рабочий вариант. вам не только js но html подучить бы...
Для просмотра ссылки Войди или Зарегистрируйся

 

[spro1]

по поводу html в первом сообщении немного неверно написал, согл(ошибся просто)... Не знаю что за дела, но у меня на сайте этот код не срабатывает. Я вижу, что по ссылке все работает и написано все верно, возможно в версии библиотеки проблема?

html генерирует компонент сайта, но разметка там такая же, попробовал просто скопировать, то что вы написали - не работает.

 

[ZiX]

по поводу html в первом сообщении немного неверно написал, согл(ошибся просто)... Не знаю что за дела, но у меня на сайте этот код не срабатывает. Я вижу, что по ссылке все работает и написано все верно, возможно в версии библиотеки проблема?

html генерирует компонент сайта, но разметка там такая же, попробовал просто скопировать, то что вы написали - не работает.

оберни в
$(document).ready(function(){
$('#spisok').on('change', function(){
var spisok = $(this).val()
if(spisok == "Значение 2")
{
$("#img img").attr("src", "/image2.jpg");
}
});
});

попробуй так.

 

[denverkurt]

если сначала идет JS код а потом HTML, то нужно делать как посоветовал ZIX, поскольку яваскрипт еще незнает ничего об $('#spisok')

а вообще открывайте firebug, консоль разработчика и читайте ошибки. чаще всего там доступным языком пишут что и где не работает, почему

 

[andystill]

Я в идеале использую $ как параметр jQuery, для нивелирования вероятности конфликта с прочими скриптами на сайте к нулю:
jQuery(document).ready(function($){
$('#spisok').on('change', function(){
var spisok = $(this).val()
if(spisok == "Значение 2")
{
$("#img img").attr("src", "/image2.jpg");
}
});
});