He creado un sencillo menú desplegable con listas anidadas. La idea es que al hacer onClick en un elemento de lista, me llame a una función que averiguará el id del elemento de la lista sobre el que se ha hecho clic.
El problema es que si hago clic en un elemento de lista anidada, me muestra el id de éste pero también el de sus ancestros.
¿Alguna solución?
Gracias.
HTML
Using html4strict Syntax Highlighting
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<link rel="stylesheet" href="estilo.css" type="text/css" media="screen"></link>
<script type="text/javascript" src="biblioteca.js"></script>
</head>
<body>
<ul id="menu">
<li id="boton_Ordenadores" >ORDENADORES
<ul id=sub_Ordenadores>
<li id="boton_Sobremesas">sobremesas</li>
<li id="boton_Portatiles">portatiles</li>
</ul>
</li>
<li id="boton_Tablets">TABLETS</li>
<li id="boton_Componentes" >COMPONENTES
<ul id=sub_Componentes>
<li id="boton_Procesadores">procesadores
<ul id=sub_Procesadores>
<li id="boton_Intel">intel</li>
<li id="boton_Amd">amd</li>
<li id="boton_Ibm">ibm</li>
</ul>
</li>
<li id="boton_Placas">placas base</li>
<li id="boton_Discos">discos duros</li>
<li id="boton_Fuentes">fuentes</li>
</ul>
</li>
</ul>
</body>
</html>
JS
Using javascript Syntax Highlighting
var descens = new Array();
var numdescens;
var idclic;
function ObtenDescens(idpadre,tagdescen)
{
descens=document.getElementById(idpadre).getElementsByTagName(tagdescen);
numdescens=descens.length;
//alert("num descendientes "+tagdescen+": " + numdescens);
}
function replegar()
{
ObtenDescens(this.id,"ul")
document.getElementById(descens[0].id).style.display='none'
}
function desplegar()
{
ObtenDescens(this.id ,"ul")
document.getElementById(descens[0].id).style.display="block";
}
function quienclic()
{
idclic=this.id
alert(idclic)
}
window.onload = function()
{
ObtenDescens("menu","li");
for(i=0;i<numdescens;i++)
{
document.getElementById(descens[i].id).onmouseover = desplegar;
document.getElementById(descens[i].id).onmouseout = replegar;
document.getElementById(descens[i].id).onclick = quienclic;
}
ObtenDescens("menu","ul");
for(i=0;i<numdescens;i++)
{
document.getElementById(descens[i].id).style.display="none";
}
}
2011-09-22 11:36 @525
