como se pone el contenido de un div en la variable?

waldragon · #1 (**permalink**) 09/09/2012, 00:59

Buenas, tengo un textarea donde se escribe y a presionar un boton se pone lo escrito en un div, pero me gustaria que en lugar de cambiar lo nuevo por lo que ya estaba en ese div, se fuera sumando todo lo escrito

Esto es lo que tengo:

Código Javascript:

Ver original<script language="javascript" type="text/javascript">
var textoo="contenido del div destino";//aca es donde tendria que tomar el contenido del div, pero no se como se hace
 
function llenarDIV(){      
var obj = document.getElementById('destino');      
obj.innerHTML = textoo + document.bbb.mensaje.value ;   }
</script>
 
<div id="destino" name="destino" value="valor por defecto">DIV sin informacion</div>
<form name="bbb">
<textarea name="mensaje"  tabindex="1" rows="4" id="mensaje" style="width:694px;" >texto de prueba</textarea>
<input type="button" value="Cambiar" onClick="llenarDIV();">
</form>

cambia lo escrito en el div destino por lo que se escribe en el textarea, pero como hago para mantener lo que ya tiene el div sumandole lo nuevo? gracias...

nilburcion · #2 (**permalink**) 09/09/2012, 08:16

Me parece que esto es lo que quieres:

Código Javascript:

Ver original<script language="javascript" type="text/javascript">
 
function llenarDIV(){
var textoo=document.getElementById("destino").innerHTML;//aca es donde tendria que tomar el contenido del div, pero no se como se hace
var obj = document.getElementById('destino');
obj.innerHTML = textoo + document.bbb.mensaje.value ;   }
</script>
 
<div id="destino" name="destino" value="valor por defecto">DIV sin informacion</div>
<form name="bbb">
<textarea name="mensaje"  tabindex="1" rows="4" id="mensaje" style="width:694px;" >texto de prueba</textarea>
<input type="button" value="Cambiar" onClick="llenarDIV();">
</form>

Para coger qualquier texto de dentro de un div, span u otro usa "innerHTML"

emprear · #3 (**permalink**) 09/09/2012, 11:01

Para darle un poco de sentido a eso que querés hacer, habría que limpiar el contenido del area de texto tras presionar le botón, si no no solo vas a estar agregandp texto, sino repitiendo una y otra vez lo ya escrito

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>titulo</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
//<![CDATA[
function llenarDIV(){
var obj = document.getElementById('destino');
obj.innerHTML += ' ' + document.getElementById('mensaje').value;
document.getElementById('mensaje').value = "";
}
//]]>
</script>
</head>
<body>
<form action="#">
<textarea tabindex="1" rows="4" cols="40" id="mensaje" style="width:694px;">
</textarea>
 <input type="button" value="Cambiar" onclick="llenarDIV();" />
 </form>
<div id="destino"></div>
</body>
</html>

Saludos

waldragon · #4 (**permalink**) 09/09/2012, 23:11

Cita:

Iniciado por nilburcion

Me parece que esto es lo que quieres:

Código Javascript:

Ver original<script language="javascript" type="text/javascript">
 
function llenarDIV(){
var textoo=document.getElementById("destino").innerHTML;//aca es donde tendria que tomar el contenido del div, pero no se como se hace
var obj = document.getElementById('destino');
obj.innerHTML = textoo + document.bbb.mensaje.value ;   }
</script>
 
<div id="destino" name="destino" value="valor por defecto">DIV sin informacion</div>
<form name="bbb">
<textarea name="mensaje"  tabindex="1" rows="4" id="mensaje" style="width:694px;" >texto de prueba</textarea>
<input type="button" value="Cambiar" onClick="llenarDIV();">
</form>

Para coger qualquier texto de dentro de un div, span u otro usa "innerHTML"

muchas gracias nilburcion, es que recien estoy empezando con js y no sabia eso.
Le agregue un salto de linea para que no salga todo seguido, es para un chat...

waldragon · #5 (**permalink**) 09/09/2012, 23:17

Cita:

Iniciado por emprear

Para darle un poco de sentido a eso que querés hacer, habría que limpiar el contenido del area de texto tras presionar le botón, si no no solo vas a estar agregandp texto, sino repitiendo una y otra vez lo ya escrito

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>titulo</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
//<![CDATA[
function llenarDIV(){
var obj = document.getElementById('destino');
obj.innerHTML += ' ' + document.getElementById('mensaje').value;
document.getElementById('mensaje').value = "";
}
//]]>
</script>
</head>
<body>
<form action="#">
<textarea tabindex="1" rows="4" cols="40" id="mensaje" style="width:694px;">
</textarea>
 <input type="button" value="Cambiar" onclick="llenarDIV();" />
 </form>
<div id="destino"></div>
</body>
</html>

Saludos

tienes razon, al ver lo que escribiste no me di cuenta que ya lo habias arreglado, entonces me puse a buscar en g como se haria eso, y cuando lo voy a agregar, veo que ya lo habias solucionado, jaja,

tambien le puse que despues de enviar ponga el foco nuevamente en el textarea y que se envie al presionar enter...

Código Javascript:

Ver original<script>
function envAUT(e) { 
tecla = (document.all) ? e.keyCode :e.which; 
    if(tecla==13 && !e.shiftKey){//13
    llenarDIV();
    return false;
    }
return true;
}
</script>
<script language="javascript" type="text/javascript">
 
function llenarDIV(){
var textoo=document.getElementById("destino").innerHTML;//aca es donde tendria que tomar el contenido del div, pero no se como se hace
var obj = document.getElementById('destino');
obj.innerHTML = textoo + "<br/>" + document.bbb.mensaje.value ;  
document.getElementById('mensaje').value = ''; //para limpiar el textarea
document.bbb.mensaje.focus();//para poner el foco o cursor en el textarea
}
</script>
 
<div id="destino" name="destino" value="valor por defecto">DIV sin informacion</div>
<form name="bbb" >
<textarea name="mensaje"  tabindex="1" rows="4" id="mensaje" style="width:694px;" onkeypress="return envAUT(event);">texto de prueba</textarea>
<input type="button" value="Cambiar" onClick="llenarDIV();">
</form>

muchas gracias, esto va tomando forma...