VALIDAR INFORMACIÓN EN CAJA DE TEXTO.
javascript: controlar entrada de datos en caja de texto (este si que funciona en chrome, firefox y explorer)
Con este código se valida lo que va tecleando el usuario en un cuadro de texto o un textarea. Puede validarse que solo escriban números, solo letras, números y letras, determinados caracteres…
Primero veremos el código (con la posibilidad de ver el ejemplo funcionando) y comentaremos el significado y funcionamiento de algunas líneas. Más adelante pondremos varias modificaciones del código original para que se adapte a lo que necesitemos en determinado momento
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<title>Validar entrada de datos</title>
<script type="text/javascript">
function validar(e) { // 1
tecla = (document.all) ? e.keyCode : e.which; // 2
if (tecla==8) return true; // 3
patron =/[A-Za-z\s]/; // 4
te = String.fromCharCode(tecla); // 5
return patron.test(te); // 6
}
</script>
</head>
<body>
<p><input type="text" name="textfield" onkeypress="return validar(event)" /><br />
<textarea rows="5" cols="20" onkeypress="return validar(event)"></textarea></p>
</body>
</html>
A continuación la explicación de las líneas de código que aparecen numeradas:
1- A la función se le pasa el objeto event
2- Aquí hay que distinguir si el navegador es Internet Explorer (IE) document.all u otro, porque ya os habreis dado cuenta que no todos los navegadores son iguales. Si el navegador es IE se asigna a la variable tecla el valor de e.keyCode, en caso contrario se asigna el valor de e.which. En los dos casos se obtiene el valor ASCII de la tecla pulsada.
3- En esta línea se comprueba si es la tecla pulsada es la tecla de retroceso y en ese caso la función termina (retorna). De esta forma se permite borrar caracteres.
4- Aquí se pone la expresión regular que permite validar si se admite o no la pulsación. En el ejemplo se admiten letras mayúsculas A-Z, letras minúsculas a-z y el espacio \s
5- Se pasa el valor ASCII de la variable tecla a su carácter correspondiente
6- Si el carácter coincide con el patrón, la función devuelve true, si no coincide devuelve false.
Ahora vamos a ver varias expresiones regulares para distintas validaciones. Sustituye la línea 4 por la que necesites:
patron = /\d/; // Solo acepta números patron = /\w/; // Acepta números y letras patron = /\D/; // No acepta números patron =/[A-Za-zñÑ\s]/; // igual que el ejemplo, pero
acepta también las letras ñ y Ñ
También se puede hacer un patrón que acepte determinados caracteres, poniendolos entre corchetes. Veamos un ejemplo para validar que solo se acepte a, j, t, 6 y 9:
patron = /[ajt69]/;
O el caso contrario, queremos aceptar cualquier caracter, menos alguno. Los que no nos sirven se ponen en el patron y se cambia un poco el código de la función que usamos para validar
patron =/[javierb]/; // 4
te = String.fromCharCode(tecla); // 5
return !patron.test(te); // 6
TOMADO DE: https://coudlain.wordpress.com/2011/07/11
TIPO DE FUENTE:En html: <FONT FACE="arial"></FONT>En css: font-family: Arial, sans-serif;
Comentarios
Publicar un comentario