Longitud máxima para HTML <textarea>

Question

Cómo restringir la cantidad máxima de caracteres que se pueden ingresar en un HTML <textarea>?Estoy buscando una solución para varios navegadores.

Answer 1

El TEXTAREA la etiqueta no tiene MAXLENGTH atribuir la forma en que unINPUT La etiqueta lo hace, al menos no en la mayoría de los navegadores estándar.Una forma muy sencilla y eficaz de limitar el número de caracteres que se pueden mecanografiado en un TEXTAREA etiqueta es:

<textarea onKeyPress="return ( this.value.length < 50 );"></textarea>

Nota: onKeyPress, va a impedir que se presione cualquier botón, cualquier botón incluido la tecla de retroceso.

Esto funciona porque la expresión booleana compara la longitud del campo antes de que el nuevo carácter se agrega a la longitud máxima que desea (50 en este ejemplo, use la suya aquí) y devuelve verdadero si hay espacio para uno más, false si no.Devolver falso en la mayoría de los eventos cancela la acción predeterminada.Entonces, si la longitud actual ya es 50 (o más), el controlador devuelve falso, el KeyPress La acción se cancela y el personaje no se agrega.

Una pega en el ungüento es la posibilidad de pegarlo en un TEXTAREA, que no causa el KeyPress evento para disparar, eludiendo este control.Internet Explorer 5+ contiene un onPaste Evento cuyo controlador puede contener el cheque.Sin embargo, tenga en cuenta que también debe tener en cuenta cuántos personajes están esperando en el portapapeles para saber si el total lo llevará a superar el límite o no.Afortunadamente, IE también contiene un objeto de portapapeles desde el objeto de la ventana.1 De este modo:

<textarea onKeyPress="return ( this.value.length < 50 );"
onPaste="return (( this.value.length +
window.clipboardData.getData('Text').length) < 50 );"></textarea>

De nuevo, el onPaste evento y clipboardData El objeto es solo IE 5+.Para una solución para varios navegadores, sólo tendrá que utilizar un OnChange o OnBlur controlador para verificar la longitud y manejarla como desee (truncar el valor en silencio, notificar al usuario, etc.).Desafortunadamente, esto no detecta el error mientras ocurre, solo cuando el usuario intenta abandonar el campo, lo cual no es tan amigable.

Fuente

Además, hay otra manera aquí, incluyendo un script terminado que podrías incluir en tu página:

http://cf-bill.blogspot.com/2005/05/textarea-maxlength-revisited.html

Answer 2

HTML5 ahora permite maxlength atributo en <textarea>.

Es compatible con todos los navegadores excepto IE <= 9 y iOS Safari 8.4.Ver mesa de apoyo en caniuse.com.

Answer 3

$(function(){  
  $("#id").keypress(function() {  
    var maxlen = 100;
if ($(this).val().length > maxlen) {  
  return false;
}  
})
});  

Referencia Establecer longitud máxima en el área de texto HTML