Contar caracteres on-line

25/Mar/2008 JavaScript , , , 3 Comentarios
Ejemplos Programación en Javascript

Vas a mandar un SMS y solo puedes enviar 150 caracteres. La aplicación a ofrecer al usuario nos va mostrando el número de caracteres que van escritos. Es una ayuda del interface de usuario, haciéndole más usable.

Este simple interface le podemos lograr mediante un área de texto y un poco de código Javascript.

La solución técnica es muy sencilla, ya que el número de caracteres nos la da la longitud del área de texto.

textoArea = document.getElementById("area_texto").value;
numeroCaracteres = textoArea.length;

Quizás el principal problema sea saber cada cuanto debemos de realizar el calculo del tamaño del área de texto. Una de las opciones sería realizar el calculo cada vez que el usuario pulse una tecla. Si bien, puede suponer una cuenta demasiado excesiva de los caracteres y habría que intentar hacerlo más espaciado, si bien, sin perder la cuenta.

Otra opción, y la que utilizamos, el utilizar un temporizador, el cual lanzaremos cada un tiempo determinado. Para ello nos apoyamos en el método setTimeOut(funcion,tiempoEnMilisegundos). Donde el parámetro función será la que calcule el tamaño del área y actualice el número de caracteres y el tiempoEnMilisegundos será, pues eso, cada cuantos milisegundos lanzamos el método. Aquí podemos jugar con los valores para ajustarlo. Para empezar vamos a utilizar 300ms.

La primera vez que lancemos el timer será al cargarse la página:

En posteriores ocasiones será cuando finalice de ejecutarse nuestro método WordCountOnLine:

function WordCountOnLine() {

  textoArea = document.getElementById("area_texto").value;

  // El numero de caracteres es su longitud
  numeroCaracteres = textoArea.length;
 
  document.getElementById("caracteres").value = numeroCaracteres;   
  setTimeout("WordCountOnLine();",300);
}

Este ejemplo se puede incrementar para que se cuenten las palabras introducidas por el usuario. Para ello es recomendable leerse el artículo Contar caracteres y palabras en JavaScript. Si bien, el código para descargar ya lleva incluida esta mejora. Así puedes ver lo simple que es hacerlo.

Vídeos sobre Javascript


3 comentarios en “Contar caracteres on-line”

Víctor Cuervo

Mario

Esta muy bien el recurso.
Comparto esta web que yo uso, permite sacar el porcentaje de repeticiones de palabras.
http://www.contadordecaracteres.info

un saludo :-)

Víctor Cuervo

fds

SELECT * FROM persoas WHERE Nif NOT IN
( select Nif from relacion where NumAccion=’04’ And NumContrato=’F20070187′)
And Nif NOT IN
( SELECT Nif FROM modents, relacion
WHERE NumContrato=’F20070187′ AND modents.NumAccion=relacion.NumAccion
AND modents.NumGrupo=relacion.NumGrupo
GROUP BY Nif
HAVING (Sum(NumHorasPres) > (270 –
(Select NumHorasPres FROM modents
WHERE NumAccion=’04’ AND NumGrupo=’55’))
)
SELECT * FROM persoas WHERE Nif IN
( SELECT Nif FROM relacion
WHERE relacion.NumAccion=’04’
AND relacion.NumGrupo=’55’
AND relacion.NumContrato=’F20070187′)

Víctor Cuervo

Matias

Buenos dias, estoy intentando usar este codigo en mi sitio, necesitaria adaptarlo para que al ingresarle un parametro a la funcion me cuente en diferentes campos algo asi…

function WordCountOnLine(‘area’);

pero no logro hacerlo andar.. mi sitio usa include en php y por lo tanto pongo el script en el index.php en el tag y tambien el onload en no se si sera este el motivo, desde ya muchas gracias!

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*