val () vs text () para textarea

106

Estoy usando jQuery y me pregunto si debería usar val () o text () (u otro método) para leer y actualizar el contenido de un área de texto.

He probado ambos y he tenido problemas con ambos. Cuando uso text () para actualizar textarea, los saltos de línea (\ n) no funcionan. Cuando uso val () para recuperar el contenido del área de texto, el texto se trunca si es demasiado largo.

Christophe
fuente
¿Qué significa que los saltos de línea no funcionan?
Kaz
@kaz: el texto permanece en la misma línea.
Christophe
¿Y qué quieres decir con "el texto se trunca" en la salida de depuración de la consola? ¿En el valor de retorno en sí mismo? Sería más fácil si proporcionara un jsfiddle ...
Constantin Groß
@Connum: en el valor de retorno. Probando jsfiddle ahora mismo ...
Christophe
1
Llegué aquí buscando en Google el texto del área de texto truncado. Arreglé mi problema agregando un par de \ n \ n al final del .val (). Extraño pero funcionó.
Darin

Respuestas:

148

La mejor manera de establecer / obtener el valor de un área de texto es .val(),.value método.

.text()utiliza internamente el método .textContent(o .innerTextpara IE) para obtener el contenido de un <textarea>. Los siguientes casos de prueba ilustran la forma text()y .val()se relacionan entre sí:

var t = '<textarea>';
console.log($(t).text('test').val());             // Prints test
console.log($(t).val('too').text('test').val());  // Prints too
console.log($(t).val('too').text());              // Prints nothing
console.log($(t).text('test').val('too').val());  // Prints too

console.log($(t).text('test').val('too').text()); // Prints test

La value propiedad , utilizada por .val()siempre muestra el valor visible actual, mientras que text()el valor de retorno de 'puede ser incorrecto.

Rob W
fuente
gracias, intentando esto ahora mismo. Actualmente no puedo replicar el problema que tuve con val () y truncamiento. Tal vez tengo al sospechoso equivocado ...
Christophe
5
Muchas gracias por los ejemplos. Aparentemente ese era mi problema, escribí con text () y leí con val ().
Christophe
Cambiar el valor de un área de texto usando text()ya no funciona después de cambiar manualmente cualquier cosa en él (por ejemplo, la adición de un personaje)
Ene
12

.val()siempre trabaja con textareaelementos.

.text()funciona a veces y falla otras veces! No es confiable (probado en Chrome 33)

Lo mejor es que también .val()funciona a la perfección con otros elementos de formulario (como input) mientras que .text()falla.

Kshitij Saxena -KJ-
fuente