[jQuery-es] Como seleccionar <ul> dentro de una lista y desplegar sus elementos hijos

Juan G. Hurtado juan.g.hurtado en gmail.com
Jue Ene 4 00:37:39 PST 2007


Buenas,

El 04/01/2007, a las 9:30, Rafa Garcia escribió:

> Carlos Sesma escribió:
>> Hola, el creador de jQuery, John Resig,  publico un screencast donde
>> hace algo muy parecido a lo que estas necesitando, es posible que te
>> sirva.
>>
>> http://ejohn.org/blog/expandable-sidebar-menu-screencast/
>
> Ya conocía este ejemplo, Carlos, pero el problema básico es que no
> recoge subniveles. Gracias por la ayuda de todos modos. Choan, no  
> estás
> por ahí? ;-)
>
> Buen jueves.
>
>>
>> Saludos
>> CS
>>
>>
>> On 1/3/07, *Rafa Garcia* <rafa.garcia en fullsix.com
>> <mailto:rafa.garcia en fullsix.com>> wrote:
>>
>>     Antes que nada, Feliz año a todos los querylisteros. Después  
>> de los
>>     buenos deseos, el pastel: tengo una lista-menú con varias listas
>>     anidadas tal como esta:
>>
>>     <ul>
>>                <li><a href="#item1">item 1</a>
>>                    <ul>
>>                        <li><a href="#item1.1">item 1.1</a></li>
>>                        <li><a href="#item1.2">item 1.2</a></li>
>>                        <li><a href="#item1.3">item 1.3</a></li>
>>                        <li><a href="#item1.4">item 1.4</a></li>
>>                    </ul>
>>                </li>
>>                <li><a href="#item2">item 2</a></li>
>>                <li><a href="#item3">item 3</a></li>
>>                <li><a href="#item4">item 4</a>
>>                    <ul>
>>                        <li><a href="#item4.1">item 4.1</a></li>
>>                        <li><a href="#item4.2">item 4.2</a></li>
>>                        <li><a href="#item4.3">item 4.3</a>
>>                            <ul>
>>                                <li><a href="#item4.3.1">item
>>     4.3.1</a></li>
>>                                <li><a href="#item4.3.2">item
>>     4.3.2</a></li>
>>                            </ul>
>>                        </li>
>>                    </ul>
>>                </li>
>>            </ul>
>>
>>     ...y lo que pretendo es seleccionar con jquery los lis que  
>> tienen uls
>>     como hijos (el li que contiene #item1, el #4 y el #4.3), y  
>> desplegar
>>     haciendo click sólo los uls que "cuelgan" de ese li padre.
>>
>>     Con este código oculto al inicio todos los uls que no sean el  
>> primero
>>     (quiero que se vea la lista)...
>>
>>     $(document).ready(function(){
>>            $("ul:not(:first)").hide();
>>
>>     Pero, como seguir....
>>
>>     Un abrazo y gracias mil por adelantado.

¿No te sirve con añadir el evento 'click' a todos los <li> de primer  
nivel y dentro de ese evento mostrar el <ul> que haya dentro, (si lo  
hay)?

$('ul:first>li').click(function() {
	$(this).find('ul').show('slow');
});

Un saludo.

PD.- No sé si el código es bueno, está escrito sobre la marcha. Pero,  
¿no te sirve la idea?
--
Juan G. Hurtado
[ juan.g.hurtado en gmail.com ]
[ http://armonia.spiral-static.org/ ]





Más información sobre la lista de distribución jquery-es