Подскажите: показать/скрыть определнный див на onselect

Real
На сайте с 24.05.2006
Offline
61
889

Суть задачи. Есть выпадающий список с незнаю сколькими пунктами, для примера взял три

<select name='choise'>

<option value='1'>товар 1</option>

<option value='2'>товар 2</option>

<option value='3'>товар 3</option>

</select>

У каждого товара есть свое описание в базе. Снизу идет див, в котором отображается это описание. Вот как сделать, чтобы при событии onselect это описание поменялось в соответствии с товаром?

Я вывел сразу все дивы с описаниями товаров в display:none, но немогу теперь сделать чтобы у нужного включалась видимость а у ненужных отключалась. Может подскажет кто решение?

он самый (http://alexvolkov.ru)
SS
На сайте с 14.04.2006
Offline
110
#1
Real:
но немогу теперь сделать чтобы у нужного включалась видимость а у ненужных отключалась.

На каком этапе Вы этого не можете понять?

SergejDergatsjev
На сайте с 22.08.2009
Offline
19
#2
Real:
Суть задачи. Есть выпадающий список с незнаю сколькими пунктами, для примера взял три
<select name='choise'>
<option value='1'>товар 1</option>
<option value='2'>товар 2</option>
<option value='3'>товар 3</option>
</select>
У каждого товара есть свое описание в базе. Снизу идет див, в котором отображается это описание. Вот как сделать, чтобы при событии onselect это описание поменялось в соответствии с товаром?

Я вывел сразу все дивы с описаниями товаров в display:none, но немогу теперь сделать чтобы у нужного включалась видимость а у ненужных отключалась. Может подскажет кто решение?

Профессор голову не морочьте не себе не другим. Используйте фраймворк. Сразу все вопросы отпадут сами собой.

http://www.eecho.info/Echo/html/jquery-links/

Для сложных прожектов рекомендую.

http://code.google.com/webtoolkit/

eEcho build a database-driven web sites. Let us build your web site! (http://www.eecho.info)
S
На сайте с 27.02.2007
Offline
60
#3

SergejDergatsjev, не морочь голову своим ворком на такой пустяковой задаче.

делаем так:

<select name='choise' onchange="funtionchange(this.value);">

<option value='1'>товар 1</option>

<option value='2'>товар 2</option>

<option value='3'>товар 3</option>

</select>

<div id=parentdiv>

Тут включены все блоки, которые нужно переключать

<div id=div1>первый из них</div>

</div>

<script>

function funtionchange(number){// переключает блоки просто по счету (id в них становится лишним)

divs = document.getElementById("parentdiv").getElementsByTagName("div");

for(i=0;i<divs.length;i++) divs.style.display = "none";
divs[number].style.display = "block";
}
function funtionchange2(number){// переключает блоки, обращаясь по id
divs = document.getElementById("parentdiv").getElementsByTagName("div");
for(i=0;i<divs.length;i++) divs.style.display = "none";
document.getElementById("div"+number+).style.display = "block";
}
</script>
Не проверял, написал наскоро. Вывирай любой вариант (funtionchange или funtionchange2). Если что, подправь ошибки и вперед

Создание сайтов, документация... (http://site3k.net/), сайт нашей дизайн-студии (http://website-it.ru/)
Real
На сайте с 24.05.2006
Offline
61
#4
SergejDergatsjev:
Профессор голову не морочьте не себе не другим. Используйте фраймворк. Сразу все вопросы отпадут сами собой.

Слегка тяжеловатое решение для такой задачи

Supervisork, первый вариант самое оно. С кавычками немного напутанно, но все ок работает, спасибо

[Удален]
#5

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

Тем более все они есть на code.google.com, можно их прямо оттуда дергать

SergejDergatsjev
На сайте с 22.08.2009
Offline
19
#6
neolord:
все равно в итоге потребуется сделать еще и еще в том же проекте. и тогда вы будете сокрушаться что один раз не подключили фреймворк.
Тем более все они есть на code.google.com, можно их прямо оттуда дергать

Респект, сразу видно человека знающего толк в дезайне. Ясно что любите доводить дело до конца.

S
На сайте с 27.02.2007
Offline
60
#7
SergejDergatsjev:
Респект, сразу видно человека знающего толк в дезайне. Ясно что любите доводить дело до конца.

Сразу видно человека, которому лень писать собственные 5 строк и, который по этой причине готов тулить чужие мегабайты кода.

Это, конечно, мое мнение. Кстати, с описанием товаров можно было бы поступить иначе: подгружать нужное, а не вписывать все сразу (если товаров много, помещать на страницу описание всех товаров накладно). Если такой вариант интересен, используй ajax. В рабочем примере внизу, замени событие для выдачи результата с сабмита на онченч

Supervisork добавил 02.09.2009 в 11:50

Вспомнил: делал подобные приблуды сюда http://supernails.de/kontakt/zayavka.html и сюда http://www.studio-tvoystyle.ru/zayzvka.html

Real
На сайте с 24.05.2006
Offline
61
#8
neolord:
потребуется сделать еще и еще в том же проекте. и тогда вы будете сокрушаться что один раз не подключили фреймворк.

Ну это когда потребуется, сейчас просто неоправданно подключать фреймворк ради такой мелочи. Тем более уже и сделал все.

SergejDergatsjev:
знающего толк в дезайне

дезайн тут причем?

Supervisork:
если товаров много, помещать на страницу описание всех товаров накладно

Не, там штук 10-15 наименований по одной строчке, особо места не займет.

Supervisork:
Вспомнил: делал подобные приблуды сюда http://supernails.de/kontakt/zayavka.html

Угу, оно. Только уже все сам сделал :)

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