¿ Como hago un link que conmuta ?

tirengarfio · #1 (**permalink**) 27/01/2010, 13:39

Hola,

tengo una pagina que lista los mensajes que un usuario a recibido.

Si el mensaje tiene más de 100 caracteres, solo se visualizan los primeros 100.

Para esos mensajes que ocupan más de 100 caracteres, tengo previsto añadir un link que diga "Ver mensaje entero" de manera que al pulsarlo se visualizará el mensaje entero, y donde estaba el link "Ver mensaje entero" aparecerá un link que dirá "Ver mensaje abreviado".

El usuario podrá pulsar de nuevo sobre "Ver mensaje abreviado" para ver tan solo de nuevo los primero 100 caracteres del mensaje.

¿Es posible lo que digo con javascript? Supongo que se usará el manejador "onClick", pero no me hago la idea de como...

Tan solo necesito un poco de orientacion o un esbozo de como seria ese link que conmuta el texto del propio link y el texto del mensaje. El resto lo puedo hacer yo.

Un saludo

Javi

David · #2 (**permalink**) 27/01/2010, 13:56

¿Algo como esto?: http://www.forosdelweb.com/wiki/Mostrar/ocultar_capas

tirengarfio · #3 (**permalink**) 28/01/2010, 13:24

Cita:

Iniciado por David

¿Algo como esto?: http://www.forosdelweb.com/wiki/Mostrar/ocultar_capas

Quizas me podria servir... en mi caso lo que quiero cambiar es el contenido de un div. ¿Existe algo asi como "capa.content.display" en vez de "capa.style.display" ??

Javi

David · #4 (**permalink**) 28/01/2010, 13:27

Para cambiar el contenido puedes usar innerHTML:

Código Javascript:

Ver originaldocument.getElementById("id_elemento").innerHTML = "Contenido";

tirengarfio · #5 (**permalink**) 28/01/2010, 14:58

Hola de nuevo y gracias, el codigo de aqui abajo hace los siguiente: cuando se carga la pagina muestra un link con el texto "Estado 1". Al pulsar sobre el link deberia aparecer la frase "Estado 2" pero..(sigue abajo)

Código HTML:

 <script type="text/javascript">
		function cambio(){
			var capa = document.getElementById("estado1");
			if (capa.id == "estado1")
                            {
                                capa.innerHTML = <a href="#" onclick="cambio()">Estado 2</a>;

                                capa.id = "estado2";
                            }
                        else{
                               capa.innerHTML = <a href="#" onclick="cambio()">Estado 1</a>;
                               capa.id = "estado1";
                        }
                        //capa.innerHTML= (capa.style.display == "none") ? "block" : "none";

                       
		}
	</script>
</head>
<body>
	<div>

		<div id="estado1">
		          <a href="#" onclick="cambio()">Estado 1</a>
		</div>

	</div>

Mi problema es que tras pulsar sobre el link inicial ("Estado 1") me aparece la frase "Estado 2" pero no como un link, sino como texto plano... ¿como hago para que sea un link?

Javi

David · #6 (**permalink**) 28/01/2010, 19:29

¿No es más sencillo que cambias directamente el contenido del enlace en lugar del div? Asigna un id al mismo enlace y cambies su contenido con la propiedad innerHTML.