Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Bianca Marcondes

abrir/fechar lista de valores

Recommended Posts

Olá, tenho um código javascript que ao clicar em um link (contido em um <li> de uma lista) abre os sub-itens dessa lista. O problema é que gostaria de construir dois links, tipo: mostrar todos os itens / esconder todos os itens. mas não estou conseguindo (provavelmente devido a minha total ignorância de js <_< )aqui está o código HTML:

<ul class="open"> <li id="item1"><a onclick="toggle('item1');"><img src="closed.gif" alt="" id="img_item1" border="0"></a>Item 1 <ul id="ul_item1" class="closed"> <li id="item1_1">Item 1.1</li> <li id="item1_2">Item 1.2</li> </ul> </li> <li id="item2"><a onclick="toggle('item2');"><img src="closed.gif" alt="" id="img_item2" border="0"></a>Item 2 <ul id="ul_item2" class="closed"> <li id="item2_1"><a onclick="toggle('item2_1');"><img src="closed.gif" alt="" id="img_item2_1" border="0"></a>Item 2.1 <ul id="ul_item2_1" cass="closed"> <li id="item2_1_1">Item 2.1.1</li> <li id="item2_1_2"><a onclick="toggle('item2_1_2');"><img src="closed.gif" alt="" id="img_item2_1_2" border="0"></a>Item 2.1.2 <ul id="ul_item2_1_2" class="closed"> <li id="item2_1_2_1">Item 2.1.2.1</li> <li id="item2_1_2_2">Item 2.1.2.2</li> </ul> </li> <li id="item2_2_3">Item 2.1.3</li> </ul> </li> <li id="item2_2">Item 2.2</li> </ul> </li> <li id="item3"><a onclick="toggle('item3');"><img src="closed.gif" alt="" id="img_item3" border="0"></a>Item 3 <ul id="ul_item3" class="closed"> <li id="item3_1">Item 3.1</li> <li id="item3_2">Item 3.2</li> <li id="item3_3">Item 3.3</li> <li id="item3_4">Item 3.4</li> <li id="item3_5">Item 3.5</li> </ul> </li></ul>

e aqui o java script:

function toggle(id){ ul = "ul_" + id; img = "img_" + id; ulElement = document.getElementById(ul); imgElement = document.getElementById(img); if (ulElement){ if (ulElement.className == 'closed'){ ulElement.className = "open"; imgElement.src = "opened.gif"; }else{ ulElement.className = "closed"; imgElement.src = "closed.gif"; } } }

queria colocar dois links, assim:<a id="openall">Open All</a><a id="closeall">Close All</a>alguém saberia como posso fazer isso?agradeço a atenção desde já :)

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tentei aqui mas a listagem já abre aberta, tanto no IE quanto no FF! :o

desculpa, foi pq esqueci de postar o código CSS:
.open {	display: block;	}.closed {	display: none;	}li {	list-style-type: none;	padding-top: .2em;	padding-bottom: .2em;	font-size: 18px;	}		li img {	vertical-align: middle;	}
vou tentar ver se através do link que você me indicou consigo fazer, obrigada!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.