Miten toteuttaisitte yksinkertaisen pudotusvalikon, joka sulkee automaattisesti muut vastaavat pudotusvalikot? Siis sellaisen, jossa klikataan jotain nappia, että valikko aukeaa ja sulkeutuu. Olen jonkinlaista härveliä yrittänyt tehdä, mutta en ole keksinyt mitään kovin validia keinoa. Googlettamallakaan en ole löytänyt. Käyttökielenä mielellään JS jne.
No laitappa koodia miten oot lähteny toteuttamaan ja mikä toteutuksessa mätttää...
Sehän oli jotenkin tähän tapaan:
<html>
<head>
<script type="text/javascript">
var dis = false;
function toggle(button, toggle)
{
if (dis == false) {
document.getElementById(toggle).style.display="none";
document.getElementById(button).innerHTML="Show";
dis = true;
} else if (dis == true) {
document.getElementById(toggle).style.display="block";
document.getElementById(button).innerHTML="Hide";
dis = false;
}
}
</script>
</head>
<body>
<form>
<p id="button" onclick="toggle('button', 'menu')">Hide</p>
<div id="menu">
Hide me!
</div>Ei varmaan mitenkään paras ratkaisu myöskään tuo, että viedään funktiolle parametreina nuo id:t. Myös tuohon asiaan saa ehdottaa parempaa ratkaisua.
Tosiaan pääongelma kuitenkin tulee silloin, kun lisätään useampi tuollainen "pudotusvalikko" toimimaan samalla funktiolla. Tärkeää on, että pudotusvalikoita voi olla samalla sivulla useita, mutta toimivat silti toisistaan riippumatta (paitsi että avonaiset pudotusvalikot sulkeutuvat uutta avatessa).
Laita valikoille sama luokka, jotta voit etsiä ne kerralla (getElementsByClassName) ja sulkea ne vaikka silmukassa ennen uuden valikon avausta. Älä käytä tilan muistamiseen erillistä muuttujaa vaan valikkoelementin luokkaa tai data-attribuutteja.
Joo, tuli itsellänikin mieleeni tuo, että suljetaan ne ensin jonkin yhteisen luokan kautta ja avataan sitten kyseinen valikko sen omalla id:llä tms. Täytyypäs vielä tutustua tarkemmin noihin data -attribuutteihin...
EDIT: Viitsitkö laittaa jonkinlaista esimerkkiä ku en oikein ymmärrä miten saisin sen tilan tallennettua käyttäen valikkoelementin luokkaa :/
Aihe on jo aika vanha, joten et voi enää vastata siihen.