OBJETIVO: Validar campo de texto sólo para escribir letras,
números con javascript
<script> function soloLetras(e){
key = e.keyCode || e.which;
Obtenemos el caracter presionado por el usuario
con toLowerCase() convertiríamos
la letra a minúscula. Con esto guardamos la letra presionada por el usuario en
la variable tecla.
tecla = String.fromCharCode(key).toLowerCase();
Se Crear una lista con todas las letras
permitidas .
letras = "
áéíóúabcdefghijklmnñopqrstuvwxyz";
Crear una lista de teclas especiales tales
8,37,39,46
especiales = [8,37,39,46];
tecla_especial = false
se busca si está la tecla presionada por el
usuario en el array de teclas especiales "especiales"
for(var i in especiales){
if(key
== especiales[i]){
tecla_especial = true;
break;
}
}
Verificamos si un caracter está dentro
de otra cadena con indexOf . devolviendo como valor la posición de la cadena encontrada o el
valor de -1 si es que no la encuentra , que para este caso queremos
if(letras.indexOf(tecla)==-1 && !tecla_especial)
falso si la tecla presionada no está en la
lista de letras permitidas hecha por nosotros
return false;
}
</script>
Usamos el evento onkeypress del campo de
texto para hacer la llamada a la función
<input type="text" onkeypress="return
soloLetras(event)">
INVESTIGACION:
Fuente:
Si hay algo
que no podemos evitar es que la persona que visita tu página copie y pegue un
texto no deseado al "input text" . Para eso podemos agregarle el
atributo "onblur" a la etiqueta input llamando a una función que
limpie el "input text" si es que encuentra un caracter no deseado.
Código :
<script>
<script>
function soloLetras(e){
key = e.keyCode || e.which;
tecla = String.fromCharCode(key).toLowerCase();
letras = " áéíóúabcdefghijklmnñopqrstuvwxyz";
especiales = [8,37,39,46];
tecla_especial = false
for(var i in especiales){
if(key == especiales[i]){
tecla_especial = true;
break;
}
}
if(letras.indexOf(tecla)==-1 && !tecla_especial)
return false;
}
function limpia(){
var val = document.getElementById("miInput").value;
var tam = val.length;
for(i=0;i<tam;i++){
if(!isNaN(val[i]))
document.getElementById("miInput").value='';
}
}
</script>
<input type="text" onkeypress="return
soloLetras(event)" onblur="limpia()" id="miInput">