Textarea controlada

Este script controla el número de caracteres que se están introduciendo en un textarea de un formulario

En esta aplicación limita el número máximo de caracteres.

Solución

<script>

function calcLong(maximo, ctrl)

{

var txt = event.target;

var numCars = event.target.parentElement[ctrl];

if (txt.value.length > maximo)

    txt.value = txt.value.substring(0,maximo);

numCars.value = txt.value.length;

}

</script>

<body>

<form action="" method="post" name="form1">

<p>Llevas<input name="caracteres" type="text" id="caracteres" value="0" size="4">caracteres escritos.

</p>

<p>El límite es de 11. </p>

<textarea name="textarea" cols="40" rows="6" onKeyUp="calcLong(11,'caracteres')"></textarea>

</form>

</body>

Explicación

El cuadro de texto está dentro de un formulario y tiene asignada la función calcLong(m, c) al evento keyUp.

Esta función lee el objeto que lanzó el evento y lo guarda en la variable txt y el campo donde anotar el número de caracteres lo extrae del romulario, que es el elemento padre del textarea. Usa como indice el nombre del campo (segundo argumento de la función).

Comprueba que el numero de caracteres no es superior al máximo (primer argumento de la función). Si es mayor no deja escribir más y recorta el texto a la longitud máxima.

Por último anota el número de caracteres en el campo del formulario para controlar cuantos caracteres se han escrito.

Como lo uso

Para probar el script puedes usar este formulario que contiene un campo de texto en el que se permite un máximo de 11 caracteres.

Observa la vinculación con la función calcLong() encargada de controlar la longitud del texto, que en este caso no deberá superar los 11 caracteres.