2010-02-03 14 views
11

¿Es posible detectar cuántos caracteres se están pegando en un área de texto HTML y cancelar el pegado si supera el límite?límite de cuántos caracteres se pueden pegar en textarea

Editar: lo que intento hacer es evitar que el usuario pegue una gran cantidad de caracteres (~ 3 millones) porque bloquea algunos navegadores. Así que quiero cancelar el pegado antes de que su navegador se bloquee. Estoy creando un editor de documentos en el que los usuarios intentarán esto. Pero pueden escribir todo lo que quieran.

+0

Realmente no se puede evitar que los usuarios bloqueen sus propios navegadores, siempre encontrarán la manera de hacerlo :-) – Bergi

Respuesta

11

se puede hacer esto en jQuery así:

$(document).ready(function(){ 
function limits(obj, limit){ 

    var text = $(obj).val(); 
    var length = text.length; 
    if(length > limit){ 
     $(obj).val(text.substr(0,limit)); 
    } else { // alert the user of the remaining char. I do alert here, but you can do any other thing you like 
     alert(limit -length+ " characters remaining!"); 
    } 
} 


$('textarea').keyup(function(){ 

    limits($(this), 20); 
}) 

    }) 

ver una demostración here.

+11

Útil al copiar/pegar con métodos abreviados de teclado o cuando el usuario está escribiendo directamente en el cuadro, pero ¿cómo lo hace cuando el usuario pega un texto largo con el botón derecho y el menú contextual? – Gabriel

0

Usaría jQuery y agregaría un controlador de eventos para el área de texto. Cuando el controlador dispare, haga el conteo y responda como lo desee.

+1

No hay forma, hasta donde yo sé, de detectar un pegado y distinguirlo de un normal entrada. Además, no hay forma de eliminar la pasta, lo mejor que puede hacer es eliminar los caracteres que harían que el área de texto excediera el límite. –

+0

Mantenga un registro de cada operación en el área de texto, mantenga el texto anterior en caché (para cada tecla), si un pegado lo hace ir más allá del límite, simplemente usó la versión previamente almacenada en caché para restablecerlo. No es necesario distinguir entre la entrada normal y un pegar en este caso. – Art

2

En IE, puede usar el evento onPaste. (MSDN documentation)

En Firefox, Safari, Opera y Chrome puede usar el evento onInput (Dottoro.com reference). Este evento se activa cuando el contenido de texto del elemento se cambia a través de la interfaz de usuario, incluido el pegado.

6
$("textarea").blur(function(event) { 
    var maxLength = 3000000; 
    var length = this.value.length; 
    if (length > maxLength) { 
     //reassign substring of max length to text area value 
     this.value = this.value.substring(0, maxLength); 
     alert(maxLength + ' characters allowed, excess characters trimmed'); 
    } 
}); 

Este jQuery concede la función anónima a las áreas de texto, esto va a recortar el texto y alertar al usuario, también puede adjuntar al evento de pulsación de tecla.

Ver: http://viralpatel.net/blogs/2008/12/set-maxlength-of-textarea-input-using-jquery-javascript.html para más detalles sobre eso.

2

No puede acceder al contenido del portapapeles a través de JS, por lo que no puede evitarlo. Sin embargo, tiene tres opciones:

  1. No permita que el usuario pegue contenido (Esta sería una muy mala idea para UX).
  2. Use un evento onPaste para substraer el contenido pegado desde 0 hasta el límite de caracteres, una vez pegado.
  3. Use un plugin javascript/flash (Esto no funcionará en dispositivos móviles).
  4. utilizar un applet o Silverlight (no me gusta éste)

Estas son sólo algunas sugerencias, y si encuentra otra manera de hacer esto, por favor hágamelo saber ella.

Cuestiones relacionadas