Newsgroup: it.comp.lang.javascript
Titolo: accedere all'id dell'elemento genitore

;-) vi prego di risparmiare a un'autrice che usa js una volta ogni morte di
papa penose ricerche in manuali e documentazione ;-)
immaginate di avere una roba del genere:
<span class="menuOut" id="elUno"><a href="blabla"
onMouseOver="mapOver(true)" onMouseOut="mapOver(false)">Testo</a></span>
come faccio a fare in modo che mapOver mi trovi automaticamente l'id dello
span che contiene il link?
voglio dire senza passarglielo manualmente con mapOver(true, elUno), la
funzione deve vedere da che link e` stata lanciata e trovare l'id dello span
che lo contiene. E' possibile?
ovviamente anche in ie4 e ns4 hehehe ;-)
se necessario vi posto più codice per farvi vedere che voglio fare
esattamente (una specie di effetto hover che mi funzioni con netscape -
senza immagini).
Rossella

Ciao,
è possibile,
vorrei vedere la definizione della class: menuOut
e se quella va bene in netscape ti ci riferisci con
document.layer[x]
in IE con
document.all[x]
x=numero interocon segno positivo
.. ci sono altre differenze, se con queste info
non ottieni quello che ti serve, posta il codice..
--
Bye
        Ro<*¿*>berto

Scusa, ho riletto solo ora bene la tua domanda! :-(
per risalire al "contenitore" dell'href in automatico,
.. con IE puoi usare:
objParent=document.links['nome onumero links'].parentElement;
mentre con netscape le cose sono + difficili,
si puo ricavare il layer che contiene href ad esempio
dando nomi simili ..:
objParent=document.layers[document.links['nome o numero links'].name+"LAY"];
.......


allora, meglio che vi dico tutto.
quello che ho è in realta` una pagina con una serie di
<div class="menu">
<span class="menuOut" id="elUno"><a href="blabla"
onMouseOver="mapOver(true)" onMouseOut="mapOver(false)">Testo</a></span>
<span class="menuOver" id="elUnoOver"><a href="blabla"
onMouseOver="mapOver(true)"
onMouseOut="mapOver(false)">Testo</a></span></div>
<div class="menu">
<span class="menuOut" id="elDue"><a href="blabla2"
onMouseOver="mapOver(true)" onMouseOut="mapOver(false)">Testo2</a></span>
<span class="menuOver" id="elDueOver"><a href="blabla2"
onMouseOver="mapOver(true)" onMouseOut="mapOver(false)">Testo2</a></span>
</div>
etc.... un div (o span non credo abbia importanza) per ogni elemento del
menu`.
all'interno di ogni div menu, il primo span, menuOut, crea un layer con lo
stile (css) adatto al mouseOut l'altro, il menuOver, con
quello adatto al mouseOver. I due layer sono esattamente sovrapposti usando
top e left nei css e la
funzione javascript mi deve cambiare la visibilità dell'uno e dell'altro al
momento del mouseOver.
In seguito dovro` anche generare il secondo span con javascript per fare un
browser check ed essere sicura che i browser che non supportano dhtml non mi
vedano due links, ma lasciamo pure questa faccenda per dopo.
Dal momento che tutti i links hanno le stesse caratteristiche stilistiche
nel mouseOut e nel mouseOver, comprese dimensioni e posizionamento,  voglio
usare le classi altrimenti sarei obbligata a riscrivere i css per ogni id
nella stessa maniera, cosa estremamente seccante in caso di modifiche a
pagine con numerosi links.
Se avessi solo un link nella pagina potrei usare solo gli id e settare i css
per questi ultimi invece che per le classi, e otterrei
facilmente quello che voglio con la funzione mapOver().
Ma con più links e diversi id ho bisogno di una funzione che mi causi
genericamente lo switch di visibilita` del layer che la contiene.
In realta` è sufficiente manipolare la visibilità del layer di classe
MenuOver, l'altro non e` necessario toccarlo, comunque tutto dipende da come
è piu` comodo fare.
Spero di essermi spiegata. :-)
Ecco qua il codice completo, un po' pasticciato e non funzionante, perche`
sto sperimentandoci sopra.
<html>
<head>
<title>Prove mouseover</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
.menu {position: relative;
    height: 25px;
    width: 180px;}
.menuOut { position: absolute;
    left: 0px;
    top: 0px;
    visibility: visible;
    height: 25px;
    width: 180px;
    font-weight: bold;
    background-color: #FFFFFF;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    font-family: "Trebuchet MS", Arial, helvetica, sans-serif;
    font-size: 16px;
    border-style: double;
    border-top-width: 4px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px
    }
.menuOver {
    position: absolute;
    left: 0px;
    top: 0px;
    height: 25px;
    width: 180px;
    visibility: hidden;
    font-weight: bold;
    background-color: #FF9966;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    text-decoration: underline;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    font-family: "Trebuchet MS", Arial, helvetica, sans-serif;
    font-size: 16px;
    border-style: inset;
    border-top-width: 4px;
    border-right-width: 4px;
    border-bottom-width: 4px;
    border-left-width: 4px
    }
a:active {  color: #000000; text-decoration: none}
a:hover {  color: #000000; text-decoration: none}
a:link {  color: #000000; text-decoration: none}
a:visited {  color: #000000; text-decoration: none}
</style>
<script language="JavaScript" type="text/javascript">
<!-- // questa ovviamente adesso non funziona perchè menuOver è una classe
non un elemento
    // al posto di menuOver ci va l'id dell'elemento span con classe
menuOver
 function mapOver(on) {
  if(document.all) whichEl = document.all.menuOver.style
  else if(document.layers) whichEl = document.elMenu.document.menuOver
  else return
  if(on) whichEl.visibility = 'visible'
  else whichEl.visibility = 'hidden'
  }
//-->
</script>
</head>
<body bgcolor="#FFFFFF">
<div class="menu">
<span class="menuOut" id="elUno"><a href="blabla"
onMouseOver="mapOver(true)" onMouseOut="mapOver(false)">Testo</a></span>
<span class="menuOver" id="elUnoOver"><a href="blabla"
onMouseOver="mapOver(true)"
onMouseOut="mapOver(false)">Testo</a></span></div>
<div class="menu">
<span class="menuOut" id="elDue"><a href="blabla"
onMouseOver="mapOver(true)" onMouseOut="mapOver(false)">Testo2</a></span>
<span class="menuOver" id="elDueOver"><a href="blabla"
onMouseOver="mapOver(true)" onMouseOut="mapOver(false)">Testo2</a></span>
</div>
</body>
</html>

Ciao,
è da modificare la struttura dello script,
ti posto mantenendo quello che tu scrivi
una versione anche per N funzionante...
function mapOver(on) {
// qui per determinare il nome del layer si troverà il metodo migliore
// puoi sempre passare il suo id dalla funzione ..
actual_id="elUno";
// nonostante la position: relative; della class menu, Netscape
// lo vede come un layer e siccome non gli dai un id lo identifico
// con il numero 0 è infatti il primo layers che N... vede ..
(document.all?document.all[actual_id].style:document.layers[0].document.laye
rs[actual_id]).visibility=(on?"visible":"hidden");
}
se mi è permesso, un suggerimento se pensi che
sia un inutile spreco mettere tanti layers nascosti,
usane uno solo che modifichi riscrivendo quello che vuoi
e prima di renderlo visibile lo posizioni sopra all'altro
es:
txt="<a ...class.."+objlink.href+"</a>"
per netscape un document.layers['xxx'].document.write(txt);
e per IE con un obj.innerHTML(txt);


 e per IE con un obj.innerHTML(txt);
ecco, com'e` che posso farlo?
devo ogni volta
1) scoprire qual è il layer a cui si deve sovrapporre, e questo lo sa
perche` glielo passo come parametro
2) leggere le coordinate del layer che va a coprire per sovrapporlo
esattamente - anche qui ti prego risparmiami penose ricerche fra le pile di
scartoffie che mi circondano, come le leggo? una volta credo che lo sapevo
ma la mia memoria e` un colabrodo
(document.all?document.all[actual_id].style:document.layers[0].document.laye
rs[actual_id]).?????
3) *e* leggerne il contenuto da copiare perche` deve essere lo stesso solo
con uno stile diverso, non solo lo href quindi ma tutto il testo. (immagino
che su ie lo leggo con innerhtml, e su ns?)
cos'è l'objlink che hai scritto sopra? da dove viene? non dirmi che devo
passargli anche un this... e siamo a tre parametri da passare ;-))) se devo
passargli anche il testo rinuncio ;-))))
4) manipolare il testo preso sopra per cambiare il valore di class (dovrei
saperlo fare, se no riscrivo qui ;-)
5) scrivere nel layer invisibile (me l'hai fatto vedere sopra)
6) posizionarlo (collegato al punto 3)
7) e infine renderlo visibile (questo lo so fare ;-)
ciao,
Rossella
ps: se un giorno ti servono dritte su xml, css e xslt, ricordati che sono in
debito con te ;-))))




 questo vale solo per N. e se il link è dentro un layer


Ciao
Nessun problema,
anzi grazie per l'aiuto
;-)
alla proxy..


io avevo provato a creare questa funzione:
function cercaLayer(objCandidateLayer, objLink) {
 var trovato = false;
 for (var i = 0 ; i < objCandidateLayer.document.layers.length ; i++) // per
tutti i layer contenuti
  {
  for (var j = 0 ; j <
objCandidateLayer.document.layers[i].document.links.length ; j++)
   {// controlliamo se contiene il nostro link
   if (objCandidateLayer.document.layers[i].document.links[j] == objLink) {
    objCandidateLayer = objCandidateLayer.document.layers[i] ; // salviamo
il nostro layer come candidato
    trovato = true ;
    break; // inutile controllare gli altri links
    }
   }
  if (!trovato) continue ; // se non c'e` passiamo al prossimo layer che
questo non ci interessa
  else if (objCandidateLayer.document.layers.length) { // se c'e` ma
contiene altri layers pero`
   objCandidateLayer = cercaLayer(objCandidateLayer, objLink); // ripetiamo
l'operazione che forse e` un altro
  // se non ci sono altri layers objCandidateLayer contiene il layer che
cerchiamo
  return objCandidateLayer ;
 }
mi sembrava che nel codice postato da Roberto ci fosse prima di tutto il
problema che
sicuramente il mio link si trova
in window.document.links[i] per un valore di i, visto che effettivamente *è*
uno dei link della finestra.
E poi c'e` il fatto che netscape non conta tutti i layers in
document.layers, ma solo quelli allo stesso livello, quindi c'era il
problema di controllare che il link non fosse in realta` in un layer piu`
interno (in altre pagine la differenza potrebbe diventare drammatica).
In verita` c'e` qualche problema col codice completo, ricevo un errore,
forse ho dimenticato qualche parentesi da qualche parte, per non dire
peggio.
Poi, inutile dirlo, forse sono stata ridondante da qualche parte, ho fatto
cose stupide e/o inutili e/o sbagliate.
Ve lo faccio sapere domani o dopo, in questo momento non sono molto lucida,
un amico messicano e` venuto a trovarci e ha portato una tequila originale
che.... non ci sono piu` abituata a queste cose, comincio a diventare
vecchia.... :-))))
domani, se recupero abbastanza lucidita`, mi studio il contributo di Paolo e
vi faccio sapere le conseguenze ;-)
ciao,
Rossella