[SOLUCIONADO] Mostrar contenido de input y después ocultarlo

MaNuX0218 · #1 (**permalink**) 11/05/2014, 12:54

Buenas a todos, quiero hacer que cuando introduzca un texto en un input al darle submit aparezca el texto escrito y desaparezca el input. ¿Como podria lograr esto?

Saludos.

Italico76 · #2 (**permalink**) 11/05/2014, 13:12

Código Javascript:

Ver original<html>
<script language="JavaScript">
/*
    Que cuando introduzca un texto en un input al darle submit aparezca el texto escrito y desaparezca el input. ¿Como podria lograr esto?
*/
function procesar() {    
    var p=document.createElement("P")
    var t=document.createTextNode("Hola "+entrada.value+ ",como va ?");
    p.appendChild(t);
    salida.appendChild(p);
}
</script>
</head>
<body>
<p>Introduzca su nombre:</p>
<input type="text" id="entrada"/>
<p><input type="button" name="Submit" value="Enviar"  onclick="procesar()"/></p>
<div id="salida"></div>
</body>
</html>

MaNuX0218 · #3 (**permalink**) 11/05/2014, 13:19

Gracias italico es lo que buscava. Y ahora como aria para que cuando aparece el texto desaparezca el input y se mantenga el texto.

Osea lo que quiero conseguir es que cuando añade el texto lo sustituya por el input para que no pueda volver a añadir, tendria que actualizar la pagina para volver añadir.

Saludos.

Italico76 · #4 (**permalink**) 11/05/2014, 13:26

Tienes varias formas de hacerlo... podrias "bloquear" el boton de Enviar (submit) o bloquear el "input text" u ocultar alguno de los dos.

Código Javascript:

Ver original<html>
<script language="JavaScript">
/*
    Que cuando introduzca un texto en un input al darle submit aparezca el texto escrito y desaparezca el input. ¿Como podria lograr esto?
*/
function procesar() {    
    var p=document.createElement("P")
    var t=document.createTextNode("Hola "+entrada.value+ ", como va ?");
    p.appendChild(t);
    salida.appendChild(p);
    enviar.setAttribute('style','display:none');
}
</script>
</head>
<body>
<p>Introduzca su nombre:</p>
<input type="text" id="entrada"/>
<p><input type="button" name="Submit" value="Enviar"  onclick="procesar()" id="enviar"/></p>
<div id="salida"></div>
</body>
</html>

Prueba eso... como solo decias "input" y no sabia cual .. pues oculte el del boton

MaNuX0218 · #5 (**permalink**) 11/05/2014, 13:32

Perfecto, esto es lo que queria, sobre ocultarlo todo ya me las apaño asi voy mirando el código y editandolo. Muchas gracias.