Limitar Número de caracteres en Textarea con JavaScript - Detodoprogramacion.org

12 junio 2013

Limitar Número de caracteres en Textarea con JavaScript

12 junio Luis_Alfer JavaScript,

Limitar Número de caracteres en Textarea con JavaScrip

Español | Online | Publicación:2013 | Free

Descripción:
Les comparto un código desarrollado con javascrip para limitar la cantidad de carateres que se puede escribir en un elemento textarea que queramos que solo se puedan escribir por ejemplo 100 letras o caracteres.

El código javascript es el siguiente:

<style type="text/css">
body {font-family: arial, helvetica;}
textarea{background-color:#BFCFFF;}
</style>
 
<script type="text/javascript">
function limita(elEvento, maximoCaracteres) {
  var elemento = document.getElementById("texto");
 
  // Obtener la tecla pulsada 
  var evento = elEvento || window.event;
  var codigoCaracter = evento.charCode || evento.keyCode;
  // Permitir utilizar las teclas con flecha horizontal
  if(codigoCaracter == 37 || codigoCaracter == 39) {
    return true;
  }
 
  // Permitir borrar con la tecla Backspace y con la tecla Supr.
  if(codigoCaracter == 8 || codigoCaracter == 46) {
    return true;
  }
  else if(elemento.value.length >= maximoCaracteres ) {
    return false;
  }
  else {
    return true;
  }
}
 
function actualizaInfo(maximoCaracteres) {
  var elemento = document.getElementById("texto");
  var info = document.getElementById("info");
 
  if(elemento.value.length >= maximoCaracteres ) {
    info.innerHTML = "Máximo "+maximoCaracteres+" caracteres";
  }
  else {
    info.innerHTML = "Puedes escribir hasta "+(maximoCaracteres-elemento.value.length)+" caracteres adicionales";
  }
}
 
</script>
</head>
 
<body>
 
<div id="info">
Máximo 100 caracteres</div>
<textarea id="texto" onkeypress="return limita(event, 100);" onkeyup="actualizaInfo(100)" rows="6" cols="30">

El resultado será este:

Máximo 100 caracteres

No hay comentarios:

Publicar un comentario

Suscribirse a: Enviar comentarios (Atom)

Copyright ©2012 - Detodoprogramacion.org Todos los Derechos Reservados. Optimizado por Luis_Alfer