probabile problema di sintassi con javascript in un menu ad albero

**birikkino** · 03-01-2005, 16:23

allora raga, spero possiate aiutarmi:

ho un menu ad albero con dei div nascosti che quando si clicca su un determinato link appaiono...

il codice è questo:

codice:

<table cellpadding='1' cellspacing='1'>
<tr>
<td width='16'>
[img]cartella.gif[/img]
</td>
<td>Gallery</td>
</table>

  
  <div id="gallery" style="display: none; margin-left: 2em;">

  <table cellpadding='1' cellspacing='1'>
  <tr>
  <td width='16'>[img]cartella.gif[/img]</td>
  <td>My 147</td>
  </table>

    
    <div id="my147" style="display: none; margin-left: 2em;">

	<table cellpadding='1' cellspacing='1'>
	<tr>
	<td width='16'>[img]documento.gif[/img]</td>
	<td>147</td>
	</tr>
	</table>

    </div>
  </div>

  
  <div id="gallery" style="display: none; margin-left: 2em;">

  <table cellpadding='1' cellspacing='1'>
  <tr>
  <td width='16'>[img]cartella.gif[/img]</td>
  <td>Meetings</td>
  </table>

    
    <div id="meetings" style="display: none; margin-left: 2em;">

	<table cellpadding='1' cellspacing='1'>
	<tr>
	<td width='16'>[img]documento.gif[/img]</td>
	<td>147l</td>
	</tr>
	</table>

    </div>
  </div>

se notate sono 2 i div nascosti con id "gallery" (che sarebbero le 2 sottocategorie della categoria principale dove ho messo le note "sottocategoria my 147" e "sottocategoria meetings") ma quando clicco sul link per aprire le sottocategorie, mi si apre solo la prima (cioè la "sottocategoria my 147")...che mi sa aiutare? riassumendo bisognerebbe far apparire due div (quelli con con id "gallery") in un solo click (o almeno credo sia questo il problema). lo so che è complicata la storia ma ve ne sarei eternamente grato...

**badaze** · 03-01-2005, 17:13

Prima cosa. Un id deve essere univoco.

**EVA_J80** · 03-01-2005, 17:21

Puoi scrivere il codice che esegui nella funzione "aprichiudi"?
Se non fai un ciclo per gli elementi del form con l'id che passi alla funzione, viene visualizzato solo il primo.

**birikkino** · 03-01-2005, 19:39

Eccoti la funzione aprichiudi:

codice:

function aprichiudi(item) {
   elem=document.getElementById(item);
   visibile=(elem.style.display!="none")
   prefisso=document.getElementById("menu" + item);
   if (visibile) {
     elem.style.display="none";
     prefisso.innerHTML="[img]cartella.gif[/img]";
   } else {
      elem.style.display="block";
      prefisso.innerHTML="[img]cartellaaperta.gif[/img]";
   }
}

Univoco o no, ci sarà pure il modo per aprirli tutti e 2 no?

P.S. grazie per la risposta!!

**badaze** · 03-01-2005, 20:26

Bisognava riordinare il codice.....

Devi avere :

codice:

Categoria 1
  Sotto categoria 1
    Link 1

Categoria 2
  Sotto categoria 2
    Link 2

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
function aprichiudi(item) {
   elem=document.getElementById(item);
   visibile=(elem.style.display!="none")
   prefisso=document.getElementById("menu" + item);
   if (visibile) {
     elem.style.display="none";
     prefisso.innerHTML="[img]cartella.gif[/img]";
   } else {
      elem.style.display="block";
      prefisso.innerHTML="[img]cartellaaperta.gif[/img]";
   }
}

//-->
</script>

</head>
<body>

<table cellpadding='1' cellspacing='1'>
<tr>
<td width='16'>
[img]cartella.gif[/img]
</td>
<td>Gallery</td>
</tr>
</table>

  
  <div id="gallery" style="display: none; margin-left: 2em;">

  <table cellpadding='1' cellspacing='1'>
  <tr>
  <td width='16'>[img]cartella.gif[/img]</td>
  <td>My 147</td>
  </table>

    
    <div id="my147" style="display: none; margin-left: 2em;">

	<table cellpadding='1' cellspacing='1'>
	<tr>
	<td width='16'>[img]documento.gif[/img]</td>
	<td>147</td>
	</tr>
	</table>

    </div>
  </div>


<table cellpadding='1' cellspacing='1'>
<tr>
<td width='16'>
[img]cartella.gif[/img]
</td>
<td>Gallery 2</td>
</tr>
</table>

  
  <div id="gallery2" style="display: none; margin-left: 2em;">

  <table cellpadding='1' cellspacing='1'>
  <tr>
  <td width='16'>[img]cartella.gif[/img]</td>
  <td>Meetings</td>
  </table>

    
    <div id="meetings" style="display: none; margin-left: 2em;">

	<table cellpadding='1' cellspacing='1'>
	<tr>
	<td width='16'>[img]documento.gif[/img]</td>
	<td>147l</td>
	</tr>
	</table>

    </div>
  </div>

</body>
</html>

PS : Se fai un copia incolla del codice devi fare in modo che java script venga scritto javascript in una sola parola.

**birikkino** · 03-01-2005, 20:52

No...non mi hai capito...così riusciva anche a me.

Non doveva risultare:

codice:

Categoria 1
  Sotto categoria 1
    Link 1

Categoria 2
  Sotto categoria 2
    Link 2

ma bensì:

codice:

Categoria 0
  Sotto categoria 1
    Link 1
  Sotto categoria 2
    Link 2

Spero di essermi spiegato bene ora... :master:

**badaze** · 03-01-2005, 21:16

Ah intendevi cosi ????

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
function aprichiudi(item) {
   elem=document.getElementById(item);
   visibile=(elem.style.display!="none")
   prefisso=document.getElementById("menu" + item);
   if (visibile) {
     elem.style.display="none";
     prefisso.innerHTML="[img]cartella.gif[/img]";
   } else {
      elem.style.display="block";
      prefisso.innerHTML="[img]cartellaaperta.gif[/img]";
   }
}

//-->
</script>

</head>
<body>

<table cellpadding='1' cellspacing='1'>
<tr>
<td width='16'>
[img]cartella.gif[/img]
</td>
<td>Gallery</td>
</table>

  
  <div id="gallery" style="display: none; margin-left: 2em;">

  <table cellpadding='1' cellspacing='1'>
  <tr>
  <td width='16'>[img]cartella.gif[/img]</td>
  <td>My 147</td>
  </table>

    
    <div id="my147" style="display: none; margin-left: 2em;">

	<table cellpadding='1' cellspacing='1'>
	<tr>
	<td width='16'>[img]documento.gif[/img]</td>
	<td>147</td>
	</tr>
	</table>

    </div>

  <table cellpadding='1' cellspacing='1'>
  <tr>
  <td width='16'>[img]cartella.gif[/img]</td>
  <td>Meetings</td>
  </table>

    
    <div id="meetings" style="display: none; margin-left: 2em;">

	<table cellpadding='1' cellspacing='1'>
	<tr>
	<td width='16'>[img]documento.gif[/img]</td>
	<td>147l</td>
	</tr>
	</table>

    </div>
  </div>


</body>
</html>

Siccome c'erano due div per il secondo livello ho creduto che tu volessi fare come ho fatto prima.Devi solo mettere tutte le voci del secondo livello nello stesso div.

**birikkino** · 03-01-2005, 21:32

Perfetto! Grande! Grazie...

Discussione: probabile problema di sintassi con javascript in un menu ad albero

Strumenti discussione

Ricerca discussione

Visualizza

probabile problema di sintassi con javascript in un menu ad albero

Permessi di invio