[SOLUCIONADO] Botonera Javascript no me da resultado

[Frantopo]

Buenas buenas.
Les traigo el siguiente acertijo! jaja.

Resulta que tengo una botonera Javascript que muestra una fila cuando le haces clic.
Muy sencilla. Tiene 3 botones.
Le haces clic en uno se abre abajo una fila diciendo 1.
Le haces clic en dos se abre abajo una fila diciendo 2
Le haces clic en tres se abre abajo una fila diciendo 3.

Ahora tengo el siguiente inconveniente.
Cuando le haces clic a la 1 y despues a la 2.

Se abre abajo una fila diciendo 1
Se abre OTRA fila abajo diciendo 2

Ahora , lo que necesito que haga. Es que si hago clic en la 1 y despues en la 2

Se cierre la 1 y despues abra la 2.

( Asi si tuvera la 3 o la 4 etc ).

Que solo muestre La fila a la que hago clic. " que no las acumule ".

Les paso el codigo.


ESTE HACE QUE MUESTRE LAS FILAS
------------
<script language="javascript">
function mostrarFormulario(id)
{
var contenedor=document.getElementById(id);
contenedor.style.display = (contenedor.style.display=='none') ? 'block' : 'none';
document.getElementById('enla').innerHTML = (contenedor.style.display=='none') ? 'Ocultar' : 'Mostrar';


}
</script>

ESTE LO TENIA AHI NOSE SI HACE ALGO INFLUYE O NO PERO LO PONGO POR LAS DUDAS
---------------------
<script type="text/javascript">
function cambiarDisplay(id) {
if (!document.getElementById) return false;
fila = document.getElementById(id);
if (fila.style.display != "none") {
fila.style.display = "none"; //ocultar fila
} else {
fila.style.display = ""; //mostrar fila
}
}
</script


/////////////////////////////////TESTING///////////////////////////////////////////

<table width='515' height='50' bgcolor='white'>

<td width='33%' valign='center' align='center' class='punteadoalto' onclick=mostrarFormulario('231'); return false>


<img src='/img/pencil.png' border='0' >


</td>
<td width='33%' valign='center' align='center' class='punteadoalto' onclick=mostrarFormulario('232'); return false>


<img src='/img/camera.png' border='0' >


</td>
<td width='33%' valign='center' align='center' class='punteadoalto' onclick=mostrarFormulario('233'); return false>


<img src='/img/sound.png' border='0'>


</td>

</table>
<div style='display:none' id='231'>

<table width='515' height='50' bgcolor='white'>
<td width='33%' valign='center' align='center' class='punteadoalto'>
1
</td></table>

</div>

<div style='display:none' id='232'>

<table width='515' height='50' bgcolor='white'>
<td width='33%' valign='center' align='center' class='punteadoalto'>
2
</td></table>

</div>

<div style='display:none' id='233'>

<table width='515' height='50' bgcolor='white'>
<td width='33%' valign='center' align='center' class='punteadoalto'>
3
</td></table>

</div>




//////////////////////////////////TESTING///////////////////////////////////////



GRACIAS DE ANTEMANO!!

[Frantopo]

RESUELTO POR MI MISMO como para no perder la costumbre (?

Cree una nueva funciòn


<script type="text/javascript">
function ocultar(id) {
if (!document.getElementById) return false;
fila = document.getElementById(id);
fila.style.display = "none"; //ocultar fila
}
</script>

Y simplemente lo que hace es cuando haces clic en la 1 por ej despues vas a la 2 la misma 2 te oculta la 1 y la 3 esten abiertas o no.
algo cavernicola pero funciona.


<td width='33%' valign='center' align='center' class='punteadoalto' onclick="ocultar('232');ocultar('233');mostrarForm ulario('231');" return false>


<img src='/img/pencil.png' border='0' >


</td>
<td width='33%' valign='center' align='center' class='punteadoalto' onclick="ocultar('231');ocultar('233');mostrarForm ulario('232');" return false>


<img src='/img/camera.png' border='0' >


</td>
<td width='33%' valign='center' align='center' class='punteadoalto' onclick="ocultar('231');ocultar('232');mostrarForm ulario('233');" return false>


<img src='/img/sound.png' border='0'>


FIN! :D