Форум Сайтостроение Веб-строительство

Select привязать изображение

Snoopik
На сайте с 20.02.2009
Offline
29
Snoopik
2812

Привет всем.

Вот срочно к html коду, к селекту 

<select name="male">

<option>-- Выбрать --</option>

<option value="1">Мужской</option>

 <option value="2">Женский</option>

</select>

Нужно сделать, чтобы, если выбран Мужчина,рядом была картинка мужчины, а когда Женский, то женщина, есть готовое решение на ?

public class SearchEngines
zhidronsss
На сайте с 12.10.2007
Offline
36
zhidronsss
#1

Присоединяюсь, вопрос интерестный

на Java Script надо делать такое, скорее всего

Dreammaker
На сайте с 20.04.2006
Offline
570
Dreammaker
#2

Snoopik, там и писать то нечего, но не хочется отвлекаться от текущей работы. На onSelect меняйте src у картинки.

update: ступил, как ниже написали, на onchange нужно вешать.

[Удален]
#3 


<select name="male" onChange="document.getElementById('im').innerHTML='<img src=\"/image'+this.options[this.selectedIndex].value+'.jpg\" />';">
<option value="0">-- Выбрать --</option>
<option value="1">Мужской</option>
 <option value="2">Женский</option>
</select><span id="im"></span>

/image0.jpg - Изображение пустоты

/image1.jpg - Изображение мужыка

/image2.jpg - изображение Девушки

Snoopik
На сайте с 20.02.2009
Offline
29
Snoopik
#4
nikitian:

<select name="male" onChange="document.getElementById('im').innerHTML='<img src=\"/image'+this.options[this.selectedIndex].value+'.jpg\" />';">
<option value="0">-- Выбрать --</option>
<option value="1">Мужской</option>
 <option value="2">Женский</option>
</select><span id="im"></span>

/image0.jpg - Изображение пустоты
/image1.jpg - Изображение мужыка
/image2.jpg - изображение Девушки

Спасибо большое=)

DA
На сайте с 04.02.2005
Offline
165
DJ_AlieN
#5

Вот так будет более правильно

<img src='' id='img' width='100' height='100'><br/>
<select name='color_id' id='color_id' onchange='ColorShow();' onkeydown='ColorShow();' onkeyup='ColorShow();'>
	<option value="0">Выберите цвет</option>
	<option value="1">В крапинку</option>
<option value="2">Сеоробармалиновый</option>
</select>
<script type='text/javascript'>
function ColorShow(){
	document.getElementById("img").src='/PATH_TO_IMAGES/'+document.getElementById("color_id").value+'.jpg';
}
</script>
тыщ-пыщ

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий