Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.11.2009, 23:28
Новичок на форуме
Отправить личное сообщение для hayk Посмотреть профиль Найти все сообщения от hayk
 
Регистрация: 13.11.2009
Сообщений: 4

Изменения изображения при выборе из списка
Дано изображение и выпадающий список:
<a  href="img/default.jpg" title="default"><img src="img/default.jpg"></a>
<br>
<select name="template">
<option value="default" selected="selected">default</option>
<option value="simple">simple</option>
<option value="other">other</option>
</select>


Как сделать так, чтобы javascript при выборе из списка брал значение value и подставлял в ссылку для изображения? Т.е. идея в том, чтобы при изменении значения в выпадающем списке менялась картинка.
Ответить с цитированием
  #2 (permalink)  
Старый 14.11.2009, 00:28
Отправить личное сообщение для Octane Посмотреть профиль Найти все сообщения от Octane  
Регистрация: 09.07.2008
Сообщений: 3,873

У селекта есть событие onchange. Добавьте обработчик этого события, который будет получать value селекта и изменять src изображения.
Ответить с цитированием
  #3 (permalink)  
Старый 14.11.2009, 14:10
Новичок на форуме
Отправить личное сообщение для hayk Посмотреть профиль Найти все сообщения от hayk
 
Регистрация: 13.11.2009
Сообщений: 4

я понимаю, я в принципе так и написал, просто javascript знаю очень плохо, а нужно очень срочно. Причём нужно сделать чисто на javascript без всяких библиотек.
Основной вопрос, как получать value и заменять src.

Помогите, хотя бы набросать приблизительный вариант, а я потом додумаю.

Последний раз редактировалось hayk, 14.11.2009 в 14:15.
Ответить с цитированием
  #4 (permalink)  
Старый 14.11.2009, 14:41
Новичок на форуме
Отправить личное сообщение для hayk Посмотреть профиль Найти все сообщения от hayk
 
Регистрация: 13.11.2009
Сообщений: 4

Всё спасибо, догнал сам

$tmp= document.forms[0].template.value;
document.tmppic.src= "img/" + $tmp + ".jpg";
Ответить с цитированием
  #5 (permalink)  
Старый 14.11.2009, 19:24
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Зачем доллар в имени переменной?
Ответить с цитированием
  #6 (permalink)  
Старый 14.11.2009, 19:26
Новичок на форуме
Отправить личное сообщение для hayk Посмотреть профиль Найти все сообщения от hayk
 
Регистрация: 13.11.2009
Сообщений: 4

точно, спасибо, привычка из php
Ответить с цитированием
  #7 (permalink)  
Старый 02.06.2010, 14:13
Новичок на форуме
Отправить личное сообщение для firs Посмотреть профиль Найти все сообщения от firs
 
Регистрация: 22.04.2010
Сообщений: 4

конечный вариант какой получится: код пожалуйста...
Ответить с цитированием
  #8 (permalink)  
Старый 02.06.2010, 15:15
Профессор
Отправить личное сообщение для Sweet Посмотреть профиль Найти все сообщения от Sweet
 
Регистрация: 16.03.2010
Сообщений: 1,618

Что-то вроде того:
document.getElementsByName('template')[0].onchange = function(){
	document.getElementsByTagName('IMG')[0].src = document.getElementsByName('template')[0].value + '.jpg'
}
Ответить с цитированием
  #9 (permalink)  
Старый 02.06.2010, 15:19
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

Цитата:
document.getElementsByName('template')[0].value
Можно заменить на this.value
Ответить с цитированием
  #10 (permalink)  
Старый 27.11.2010, 23:46
Интересующийся
Отправить личное сообщение для gustovskiy Посмотреть профиль Найти все сообщения от gustovskiy
 
Регистрация: 25.11.2010
Сообщений: 21

Можно сделать как я себе

if (form.color[0].selected){
var color=0;
form.img.src="img/small1.jpg";
txt2.innerHTML="Описание";
}
else if (form.color[1].selected){
var color=0;
form.img.src="img/small2.jpg";
txt2.innerHTML="Описание";
}
else if (form.color[2].selected){
var color=0;
form.img.src="img/small3.jpg";
txt2.innerHTML="Описание";
}


Список select при этом должен выглядеть так
<option id="0" selected="selected">Первый</option>
<option id="1">Второй</option> 
<option id="2">Третий</option> 
<option id="3">Четвертый</option>


В картинке оставить пустым src=""
А если надо вставить описание то в форме прописывать id="txt2"
Пример <div id="txt2"></div>

Последний раз редактировалось gustovskiy, 27.11.2010 в 23:49.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
изменения рисунка при наведении курсора Kenan Bek Events/DOM/Window 24 19.12.2010 19:48
при выборе в 1-ом select соот.-щая инф. отображается в другом select celencer Общие вопросы Javascript 1 24.05.2009 19:38
Выделение строки <select> при выборе другого <select> simbion Элементы интерфейса 12 05.05.2009 02:43
раскрывать/скрывать <td> при выборе определенного элемента списка zip Элементы интерфейса 2 19.01.2009 12:58
как при добавлении изображения на сервер считывать имя в БД? solomusic Серверные языки и технологии 3 12.06.2008 22:28