<select> и <div> проблем

gamena007

Registered
Здравейте!

Значи имам следния проблем:

Код:
<select name="type">
<option value="0">(избери)</option>
<option value="25">e-Books</option>
<option value="10">Games/PC ISO</option>
<option value="11">Games/PC RIP</option>
<option value="12">Games/PS2</option>
</select>

това е емно примерно select меню.

Как да го направя така, че като избера някое от тея Games да ми излезе някакъв <div> с id=games

например съм го скрил и като избера Games той да излезе.

Благодаря!
 
това става ли - http://web-tourist.net/project/svilkaa/select.html :roll:

Edit: виж и това http://web-tourist.net/project/svilkaa/select2.html
 
какъв е проблема с HTML кода?

Код:
<div id="PortalDIV" class="showhide"><center><a href="web-tourist.net" />web-tourist rulz</a></center></div>

работи си перфектно :?
 
Код:
   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title>untitled</title>
<style type="text/css">

..showhide {
width: 130px;
height: 16px;
font-weight: 800;
text-align: center;
border: 2px black dashed;
display: none;
}

</style>
<script type="text/javascript">

var divs = {
'option1' : 'InternetDIV' ,
'option2.0' : 'PortalDIV' ,
'option2.1' : 'WebmailDIV' ,
'option2.2' : 'POP3DIV' ,
'option2.3' : 'MessengerDIV' ,
'option2.4' : 'NewsgroupsDIV',
'option2.5' : 'NewDIV',
'option2.6' : 'NewsDIV',
'option2.7' : 'NewsgDIV',
'option2.8' : 'NewsgrDIV',
'option2.9' : 'NewsgroDIV'
}

function showhide(obj)
{
var el, v = obj.options[obj.selectedIndex].value;
for (var opt in divs)
if (el = document.getElementById(divs[opt]))
el.style.display = (opt != v) ? 'none' : 'block';
}

window.onload = function()
{
document.getElementById('internet').onchange();
}

</script>
</head>
<body>
<form name="form1" method="post" action="">
<select id="internet" name="internet" onchange="showhide(this)">

<option value="option2.0">1</option>
<option value="option2.1">2</option>
<option value="option2.2">3</option>
<option value="option2.3">4</option>
<option value="option2.4">5</option>
<option value="option2.5">6</option>
<option value="option2.6">7</option>
<option value="option2.7">8</option>
<option value="option2.8">9</option>
<option value="option2.9">10</option>
</select>
</form>
<div id="PortalDIV" class="showhide">1</div>
<div id="WebmailDIV" class="showhide">2</div>
<div id="POP3DIV" class="showhide">3</div>
<div id="MessengerDIV" class="showhide">4</div>
<div id="NewsgroupsDIV" class="showhide">5</div>
<div id="NewDIV" class="showhide">6</div>
<div id="NewsDIV" class="showhide">7</div>
<div id="NewsgDIV" class="showhide">8</div>
<div id="NewsgrDIV" class="showhide">9</div>
<div id="NewsgroDIV" class="showhide">10</div>





</body>
</html>

enjoy 10x to svilkaa
 
имам едно въпросче.

защо ми показва само последното от divs?

Код:
<style type="text/css">

.showhide {
display: none;
}

</style>
<script type="text/javascript">

var divs = {
'0' : 'Няма жанове.' ,
'1' : 'MOVIES' ,
'2' : 'MOVIES' ,
'3' : 'MOVIES' ,
'4' : 'MOVIES' ,
'5' : 'MOVIES' ,
'6' : 'MOVIES' ,
'7' : 'MOVIES' ,
'8' : 'MOVIES' ,
'9' : 'MOVIES' ,
'10' : 'games' ,
'11' : 'games' ,
'12' : 'games' ,
'13' : 'games' ,
'14' : 'games' ,
'15' : 'games' ,
'16' : 'NewsgroupsDIV'
}

function showhide(obj)
{
var el, v = obj.options[obj.selectedIndex].value;
for (var opt in divs)
if (el = document.getElementById(divs[opt]))
el.style.display = (opt != v) ? 'none' : 'block';
}

window.onload = function()
{
document.getElementById('0').onchange();
}

</script>

например само на 9 ми излиза MOVIES
 
сигурен ли си че вкарваш правилно

<option value="9">9</option>
<option value="8">8</option>

и т.н. със стойностите, които си вкарал в скрипта горе
 
<option value="tuka nomera">imeto</option>

ем да
ето ми го кода на страницата:

Код:
<style type="text/css">

.showhide {
display: none;
}

</style>
<script type="text/javascript">

var divs = {
'0' : 'Няма жанове.' ,
'1' : 'MOVIES' ,
'2' : 'MOVIES' ,
'3' : 'MOVIES' ,
'4' : 'MOVIES' ,
'5' : 'MOVIES' ,
'6' : 'MOVIES' ,
'7' : 'MOVIES' ,
'8' : 'MOVIES' ,
'9' : 'MOVIES' ,
'10' : 'games' ,
'11' : 'games' ,
'12' : 'games' ,
'13' : 'games' ,
'14' : 'games' ,
'15' : 'games' ,
'16' : 'NewsgroupsDIV'
}

function showhide(obj)
{
var el, v = obj.options[obj.selectedIndex].value;
for (var opt in divs)
if (el = document.getElementById(divs[opt]))
el.style.display = (opt != v) ? 'none' : 'block';
}
</script>


<tr onmouseover="this.style.backgroundColor='#FFE5E0'" onmouseout="this.style.backgroundColor=''"><td class="heading" valign="top" width=15% align="right">Категория</td><td valign="top" align=left><select name="type" onchange="showhide(this)">
<option value="0">(избери)</option>
<option value="25">e-Books</option>

<option value="10">Games/PC ISO</option>
<option value="11">Games/PC RIP</option>
<option value="12">Games/PS2</option>
<option value="13">Games/PSP</option>
<option value="14">Games/XBOX</option>
<option value="15">Games/XBOX-360</option>
<option value="8">Movies/Anime&Manga</option>
<option value="9">Movies/Documentaries</option>

<option value="1">Movies/DVD-R</option>
<option value="4">Movies/HDTV</option>
<option value="7">Movies/TV-Boxset</option>
<option value="6">Movies/TV-episodes</option>
<option value="3">Movies/VCD/SVCD</option>
<option value="5">Movies/x264</option>
<option value="2">Movies/XviD</option>
<option value="20">Music/DVD</option>
<option value="19">Music/FLAC</option>

<option value="17">Music/MP3</option>
<option value="18">Music/Video</option>
<option value="23">Other</option>
<option value="21">Software/PC ISO</option>
<option value="22">Software/PDA/Smartphone</option>
<option value="24">TV Shows</option>
<option value="16">XXX (18+)</option>
</select>
</td></tr>
 

Back
Горе