Texto que se oculta al clickar el link

[kike2lucas]

Hola a todos. Estuve visitando otros temas en este foro y me han sido de gran ayuda, pero tengo un detalle en mi página que no encuentro la solución.

Quiero que un vínculo cambie de forma al mostrar un div en principio oculto

El vínculo dice [read more] (es un web en inglés) y al clickarlo me muestra el texto, y quiero que se reemplaze por el texto [-]

Viendo que los vínculos eran varios tuve que cortar pedazos de código distinto. El texto me lo muestra y oculta perfectamente, pero no me cambia el link de forma

Adjunto la función Javascript, seguramente alguien podrá ayudarme. Yo soy novato en Javascript

Código:

<script>
function mostrar(enla) {
	obj = document.getElementById('oculto'+enla);
	obj.style.display = (obj.style.display == 'block') ? 'none' : 'block';
        enla.innerHTML = (enla.innerHTML == 'x') ? 'read more' : 'x';
} 

</script>

Los div a los que afecta son varios: oculto1, oculto2, oculto3, etc. Si es necesario adjunto el código, aunque supongo que el error está en el script.

Gracias

[kike2lucas]

Perdón, quiero que lo reemplaze por una x [x]

[JavierB]

Hola kike2lucas

Pon el código del div y del enlace, a ver si se nos ocurre algo.

Saludos,

[Adler]

Hola

El argumento que le pasas a la función (enla) trae los valores 1,2,3,4... Ahora la pregunta es ¿es ese el id, en tu caso, el nombre, de los vinculos?

Suerte

Vaya racha que llevo de pisar, perdona JavierB

[kike2lucas]

Ok. El código es este.

<script>
function mostrar(enla) {
obj = document.getElementById('oculto'+enla);
obj.style.display = (obj.style.display == 'block') ? 'none' : 'block';
enla.innerHTML = (enla.innerHTML == 'x') ? 'read more' : 'x';
}

</script>

y los div, estos:

<b>TSSA</b>: Technical Service Support Agreements [<a class="int" href="#" onclick="mostrar('1'); return false" />read more</a>]<br />
<div id="oculto1" style="display:none">
<span class="red">Engine/APU fleet management service delivering</span>: Maintenance tendering &amp; MRO contract negotiation; Maintenance policy &amp; procedures development ; fleet life cycle cost management; shop visit scheduling and budget planning; engine condition monitoring &amp; on-wing troubleshooting; shop visit credit negotiations; warranty &amp; insurance claim processing; component scrap reviews; PMA &amp; DER analysis and recommendation; OEM representation; AD &amp; SB monitoring &amp; recommendation; LLP &amp; component soft time monitoring.<br />
</div>

<br />
<b>FSSA</b>: Field Service Support Agreements [<a class="int" href="#" onclick="mostrar('2'); return false" />read more</a>]<br />
<div id="oculto2" style="display:none">
Engine /APU borescope inspections, on-wing troubleshooting, return to service certification (EASA/FAA)<br />
<br />
</div>
<br />

Ya les digo, de Javscript no me entero de nada. Gracias

[JavierB]

Hola de nuevo.

Pon así el enlace:

Código javascript:

<a class="int" href="#" onclick="mostrar('1',this); return false">read more</a>
 

Y el código:

Código javascript:

function mostrar(enla,enlace) {
obj = document.getElementById('oculto'+enla);
obj.style.display = (obj.style.display == 'block') ? 'none' : 'block';
enlace.innerHTML = (enlace.innerHTML == 'x') ? 'read more' : 'x';
}
 

Saludos,

[kike2lucas]

Funcionó! Genial, Gracias.
Otra medalla de mi parte.

[decinti]

Saludos amigos, necesito mostrar/ocultar simultáneamente varios div, encontré esta magnífica función que he aplicado como sigue. La cosa es saber si se puede y cómo reducir la función a su mínima expresión. ¿Me podéis aconsejar?, me imagino que se puede!!

----------------------------

<script>
function mostrar(enla) {
obj = document.getElementById('oculto');
obj.style.display = (obj.style.display == 'block') ? 'none' : 'block';
enla.innerHTML = (enla.innerHTML == 'Ocultar todo') ? 'Mostrar todo' : 'Ocultar todo';
}
function mostrar1(enla) {
obj = document.getElementById('oculto1');
obj.style.display = (obj.style.display == 'block') ? 'none' : 'block';
enla.innerHTML = (enla.innerHTML == 'Ocultar todo') ? 'Mostrar todo' : 'Ocultar todo';
}
function mostrar2(enla) {
obj = document.getElementById('oculto2');
obj.style.display = (obj.style.display == 'block') ? 'none' : 'block';
enla.innerHTML = (enla.innerHTML == 'Ocultar todo') ? 'Mostrar todo' : 'Ocultar todo';
}
</script>
</head>
<body>
<a href="#" onClick="mostrar(this);mostrar1(this);mostrar2(thi s); return false" />Mostrar todo</a>
<div id="oculto" style="display:none">
Este texto se verá cuando yo quiera
</div>
<div id="oculto1" style="display:none">
Este texto se verá cuando yo quiera
</div>
<div id="oculto2" style="display:none">
Este texto se verá cuando yo quiera
</div>
<p>Texto visible</p>
</body>

----------------------------

Un gran abrazo