funciones de eventos con javascript

[fmiguelcapel]

Buenos días; resulta que he hecho varias funciones para que se produzca el siguiente evento:
que al hacer click en los diferentes enlaces se oculte su contenido respectivamente y al estar aculto sus respectivos "divs" cambie el escrito del enlace. Esto lo he conseguido. El problema me surje que he hecho tres funciones para los tres divs; me podrían decir como hacer para encajar todas estas instrucciones en una sola funcion? ocuparia menos y estaria todo mucho mas limpio...saludos.


function muestraOculta() {

if(document.getElementById("contenidos_1").style.d isplay=="block"){
document.getElementById("contenidos_1").style.disp lay="none";

}
else{
document.getElementById("contenidos_1").style.disp lay="block";
}
if(document.getElementById("contenidos_1").style.d isplay=="none"){
document.getElementById("enlace_1").innerHTML="Mos trar contenidos";}
else{document.getElementById("enlace_1").innerHTML ="Ocultar contenidos";}

}
function muestraOculta_2(){
if(document.getElementById("contenidos_2").style.d isplay=="block"){
document.getElementById("contenidos_2").style.disp lay="none";
}
else{
document.getElementById("contenidos_2").style.disp lay="block";
}
if(document.getElementById("contenidos_2").style.d isplay=="none"){
document.getElementById("enlace_2").innerHTML="Mos trar contenidos";}
else{document.getElementById("enlace_2").innerHTML ="Ocultar contenidos";}

}
function muestraOculta_3(){
if(document.getElementById("contenidos_3").style.d isplay=="block"){
document.getElementById("contenidos_3").style.disp lay="none";
}
else{
document.getElementById("contenidos_3").style.disp lay="block";
}
if(document.getElementById("contenidos_3").style.d isplay=="none"){
document.getElementById("enlace_3").innerHTML="Mos trar contenidos";}
else{document.getElementById("enlace_3").innerHTML ="Ocultar contenidos";}
}

[David]

Hola, fmiguelcapel.

Te había contestado esa pregunta en el otro tema que abriste:
http://www.forosdelweb.com/f13/event...6/#post4321419
¿Intentaste investigar a partir de allí?

[fmiguelcapel]

no. lo que pasa que no entendi tu explicacion y el fragmento de codigo que planteaste y quise explicarme mas claramente que es lo que queria conseguir...

[David]

Es sencillo, sólo pásale como parámetro el id que quieras mostrar/ocultar:

Código Javascript:

function muestraOculta(divid) {
var obj = document.getElementById(divid);
obj.style.display = (obj.style.display == "block") ? "none" : "block";
}
 

A la hora de llamar:

Código Javascript:

muestraOculta("id_del_div_que_quieres_ocultar");
 

[fmiguelcapel]

supongo que querias decir algo como esto...

function muestraOculta(enlace_1,contenidos_1,enlace_2,conte nidos_2,enlace_3,contenidos_3) {
//condiciones para el primer div(contenidos_1)y su enlace (enlace_1)
if(contenidos_1.style.display=="block"){
contenidos_1.style.display="none";
}
else{
contenidos_1.style.display="block";
}
if(contenidos_1.style.display=="none"){
enlace_1.innerHTML="Mostrar contenidos";}
else{enlace_1.innerHTML="Ocultar contenidos";}
//condiciones para el segundo div(contenidos_2)y su enlace (enlace_2)
if(contenidos_2.style.display=="block"){
contenidos_2.style.display="none";
}
else{
contenidos_2.style.display="block";
}
if(contenidos_2.style.display=="none"){
enlace_2.innerHTML="Mostrar contenidos";}
else{enlace_2.innerHTML="Ocultar contenidos";}
//condiciones para el tercer div(contenidos_3)y su enlace (enlace_3)
if(contenidos_3.style.display=="block"){
contenidos_3.style.display="none";
}
else{
contenidos_3.style.display="block";
}
if(contenidos_3.style.display=="none"){
enlace_3.innerHTML="Mostrar contenidos";}
else{enlace_3.innerHTML="Ocultar contenidos";}

}

[David]

No, no me refiero a eso. Si te das cuenta, estás repitiendo mucho código, revisa bien el ejemplo que te indiqué, verás que podrás usar una misma función para los 3 casos cambiando solo el valor del os parámetros.

[fmiguelcapel]

ok; que te parece este:

function muestraOculta(enlace_1,contenidos_1) {

if(contenidos_1.style.display=="block"){
contenidos_1.style.display="none";
}
else{
contenidos_1.style.display="block";
}
if(contenidos_1.style.display=="none"){
enlace_1.innerHTML="Mostrar contenidos";}
else{enlace_1.innerHTML="Ocultar contenidos";}

}