visa/göm flera id:s

doggelitoMedlem sedan juni 20003 076 inlägg

Frågan30 nov. 2004 16:01#1

jag skulle behöva lite hjälp!
vid klick på huvudlänk så ska underkategorierna visas/gömmas.
tänkte att man kunde typ splitta id:na och visa/gömma alla id:n som innehåller huvudlänkens id.
jag behöver alltså hjälp med splitten och loopen i funktionen.
(om inte nån har en bättre lösning förståss!)

<script type="text/javascript">
function switchTR(nr) {

	tBodyObj = document.getElementById(nr)

	if (tBodyObj.style.display == ''){
		tBodyObj.style.display = 'none'
	}
	else{
		tBodyObj.style.display = ''
	}
}
</script>

<tr id="1"><td onClick="swithTR(1)">Huvudlänk 1</td></tr>
<tr id="1,1" style="display:none"><td>Underlänk 1</td></tr>
<tr id="1,2" style="display:none"><td>Underlänk 2</td></tr>

dectgapMedlem sedan sep. 20021 655 inlägg

30 nov. 2004 16:55#2

Genom att gå ifrån tabell-strukturen kan du lösa det på ett mycket smidigare sätt, men visst går det att lösa.

Jag försökte mig på ett sätt att stega upp och ner bland noderna, men det ville sig inte riktigt.
Ett annat sätt som jag fick att fungera är som följer:

<script type="text/javascript">
function switchTR(nr) {
	var trObj = document.getElementById(nr)
	var baseId = trObj.id;
	var setDisplayTo = trObj.style.display == "" ? "none" : "";
	trObj.style.display = setDisplayTo;

	var nextObj, i = 1;
	while(nextObj = document.getElementById(baseId + "," + (i++)))
		nextObj.style.display = setDisplayTo;
}
</script>

...

<tr id="1"><td onClick="switchTR(1)">Huvudlänk 1</td></tr>
<tr id="1,1" style="display:none"><td>Underlänk 1</td></tr>
<tr id="1,2" style="display:none"><td>Underlänk 2</td></tr>

Jag blev inte riktigt klok på hur du vill att det ska fungera, så det blev till viss del en gissning.

Men som sagt:
Om du ändrar struktur och bygger det hela med listor blir det mycket enklare. Då plockar du bara bort en lista med länkar (ett element) istället för att behöva loopa igenom och leta en massa rader.