Domanda

Come limitare il numero massimo di caratteri che possono essere immessi in un codice HTML <textarea>?Sto cercando una soluzione cross-browser.

È stato utile?

Soluzione

IL TEXTAREA il tag non ha un file MAXLENGTH attribuire il modo in cui anINPUT tag lo fa, almeno non nella maggior parte dei browser standard.Un modo molto semplice ed efficace per limitare il numero di caratteri che possono essere digitato in un TEXTAREA l'etichetta è:

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

Nota: onKeyPress, impedirà la pressione di qualsiasi pulsante, qualsiasi pulsante Compreso il tasto backspace.

Funziona perché l'espressione booleana confronta la lunghezza del campo prima che il nuovo carattere venga aggiunto alla lunghezza massima desiderata (50 in questo esempio, usa il tuo qui) e restituisce vero se c'è spazio per un altro, false altrimenti.Restituendo false dalla maggior parte degli eventi si annulla l'azione predefinita.Quindi, se la lunghezza corrente è già 50 (o più), il gestore restituisce falso, il KeyPress l'azione viene annullata e il personaggio non viene aggiunto.

Un neo è la possibilità di incollare in a TEXTAREA, che non causa il KeyPress evento da attivare, aggirando questo controllo.Internet Explorer 5+ contiene un onPaste Evento il cui gestore può contenere il controllo.Tuttavia, nota che devi anche tenere conto di quanti personaggi stanno aspettando negli appunti per sapere se il totale ti porterà oltre il limite o meno.Fortunatamente, IE contiene anche un oggetto degli appunti dall'oggetto finestra.1 Così:

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

Ancora una volta, il onPaste evento e clipboardData gli oggetti sono solo IE 5+.Per una soluzione cross-browser, dovrai semplicemente utilizzare un file OnChange O OnBlur gestore per controllare la lunghezza e gestirla come preferisci (troncare il valore in modo silenzioso, avvisare l'utente, ecc.).Sfortunatamente, questo non rileva l'errore mentre si verifica, solo quando l'utente tenta di lasciare il campo, il che non è altrettanto amichevole.

Fonte

Inoltre, c'è un altro modo qui, incluso uno script finito che potresti includere nella tua pagina:

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

Altri suggerimenti

HTML5 ora lo consente maxlength attribuire su <textarea>.

È supportato da tutti i browser tranne IE <= 9 e iOS Safari 8.4.Vedere tabella di supporto su caniuse.com.

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

Riferimento Imposta la lunghezza massima nell'area di testo Html

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top