Modificación de textarea no conlleva modificación de innerHTML de textarea

Pantaláimon · #1 (**permalink**) 01/07/2014, 05:53

Buenas, voy de mal en peor.

La situación es que, trabajando en un proyecto en el cual tengo que actualizar registros de la base de datos mediante las funciones ajax de JQuery, me he encontrado que la modificación no se realizaba.

La sorpresa mayor ha sido cuando he visto que no se modificaba porque el propio input no reaccionaba al cambio que yo le daba. He reducido el problema a 10 lineas de código donde se dispara una función ante un evento change en textarea y muestra el texto que tiene en su interior. Sin embargo, nunca me muestra el texto que tiene en su interior sino, el texto inicial que contenía el elemento textarea.

http://jsfiddle.net/xp3d5/1/

Un saludo!

Italico76 · #2 (**permalink**) 01/07/2014, 08:30

Un TEXTAREA no tiene tags dentro....... es algo conceptual ... es semantico, asi si funciona:

Código Javascript:

Ver original<body>
    <textarea id="raro" name="abracadabra">tyg</textarea>
    <div id="output"></div>
</body>
 
 
<script>
window.onload = function()
{
    var textarea = document.getElementById("raro");
    
    textarea.onchange = function(){
        
        var output = document.getElementById("output");
    
        console.log(textarea.value);
        output.innerHTML = textarea.value;
    }
    
}
</script>

Nota he cambiado textarea.innerHtml por textarea.value

Alexis88 · #3 (**permalink**) 01/07/2014, 12:11

Creo que el evento más adecuado para detectar un cambio en el contenido del <textarea> es el evento keyup. Y como bien te dice Italico76, el contenido del mismo lo obtienes mediante la propiedad value,

Código Javascript:

Ver originalwindow.onload = function(){
    document.getElementById("raro").onkeyup = function(){
        document.getElementById("output").innerHTML = this.value;
    };
};

Saludos

Pantaláimon · #4 (**permalink**) 03/07/2014, 10:57

Gracias.

Había inducido una regla errónea pensando que los elementos html del estilo <X></X> se sacaba el valor a través de textContent/innerHTML mientrar que algunos elementos del estilo <Y/> se les añadía mediante el atributo value.

Como curiosidad. Aunque no tiene mucho que ver con el tema inicial. ¿Por qué el elemento output se dice que no tiene atributo value pero en cambio se usa dicho atributo para el ejemplo de uso que ponen en Javascript?
http://www.w3schools.com/tags/tag_output.asp
https://developer.mozilla.org/es/doc...Element/output

Un saludo!

Alexis88 · #5 (**permalink**) 03/07/2014, 16:53

Según esto, sí puede tener ese atributo.

Saludos