Los distintos códigos explicados
<![CDATA[
<script type="text/javascript" src="overlib.js"><!-- overLIB (c) Erik Bosrup --></script>]]>
Este script habilita a el archivo 'overlib.js 'de Erik Bostrup, que hace que al pasar el Mouse por un elemento, podamos colocar una explicación.
<![CDATA[
<link rel="shortcut icon" href="AM.ico" type="image/x-icon">
]]>
Este tag nos permite colocar un Icono en la pestaña del navegador
<![CDATA[
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
]]>
Este tag nos permite declarar caracteres como acentos y otros caracteres aespeciales.
<![CDATA[
<xmp>
<script>
function validarEmail(elemento){
var texto = document.getElementById(elemento.id).value;
var regex = /^(([^<>()[\]\.,;:áéíóú\s@\"]+(\.[^<>()[\]\.,;: \s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
if (!regex.test(texto)) {
document.getElementById("resultado").value = "Correo invalido";
} else {
document.getElementById("resultado").value = "Correo a Confirmar";
}
}
</script>
]]>
Este script nos anuncia que cualquiera de esos caracters, (var regex), avisa que es un 'Correo inválido'
<![CDATA[
<script>
function validar_textob(e){
tecla = (document.all) ? e.keyCode : e.which;
//Tecla de retroceso para borrar, siempre la permite
if (tecla==8){
return true;
}
// Patron de entrada, en este caso solo acepta numeros
patron =/[A-Z_@.a-z0-9]/;
tecla_final = String.fromCharCode(tecla);
return patron.test(tecla_final);
}
</script>
]]>
En este script la funcion 'validar_textob(e)' solo deja anotar por el
Usuario, en la caja de texto correspondiente a E-mail, las letras mayúsculas,
minúsculas, guión bajo, arroba y números del 0 al 9, mas la tecla retroceso.
<![CDATA[
<script>
function validar_textoa(e){
tecla = (document.all) ? e.keyCode : e.which;
//Tecla de retroceso para borrar, siempre la permite
if (tecla==8){
return true;
}
// Patron de entrada, en este caso solo acepta numeros
patron =/[A-Z a-z 0-9]/;
tecla_final = String.fromCharCode(tecla);
return patron.test(tecla_final);
}
</script>
]]>
En este script la funcion 'validar_textoa(e)' solo deja anotar por el
Usuario, en la caja de texto correspondiente a Contraseña, las letras
mayúsculas, minúsculas, espacio en blanco y números del 0 al 9, mas la tecla retroceso.
<![CDATA[
<script>
function validar_textoc(e){
tecla = (document.all) ? e.keyCode : e.which;
//Tecla de retroceso para borrar, siempre la permite
if (tecla==8){
return true;
}
// Patron de entrada, en este caso solo acepta numeros
patron =/[a-z0-9]/;
tecla_final = String.fromCharCode(tecla);
return patron.test(tecla_final);
}
</script>
]]>
En este script la función validar_textoc(e), no permite anotar letras
mayúsculas, ni espacios en blanco, solo minúsculas y números.
Pregunta Juan el pregunton; Por que...?
...porque muchos servidores no aceptan palabras Mayúscula , y los espacios
en blanco los interpreta como '%20', entonces cuando el Usuario
coloque su nombre, el programa NO lo vá a encontrar.
<![CDATA[
<script>
function TestaVal() {
valor = document.getElementById("campo").value;
valor1 = document.getElementById("campo1").value;
valor2 = document.getElementById("email").value;
if( valor == null || valor.length == 0 || /^\s+$/.test(valor) ) {//no coloca espacios en blanco
alert ("Por favor colocá un Nombre de Usuario válido")
document.formulario.nombre.focus();
document.formulario.nombre.select();
return false;
}
else if( valor1 == "" || valor.length == 0 || /^\s+$/.test(valor1) ) {
alert ("Por favor colocá letras y/o números en CONTRASEÑA")
document.formulario.password.focus();
document.formulario.password.select();
return false;
}
else if( valor2 == "" || valor.length == 0 || /^\s+$/.test(valor2) ) {
alert ("Por favor colocá letras y/o números en E-Mail ")
document.formulario.email.focus();
document.formulario.email.select();
return false;
}
else {
return true } }
</script>
]]>
esta función, (Testaval()), hace que el usuario no deje algun 'text' sin llenar.
<![CDATA[
<script language="JavaScript">
function arranque()
{
formulario.nombre.focus();
}
</script>
]]>
Este script hace que al arrancar la página el elemento nombre,(caja de
texto Nombre de Usuario0, tome el foco del titilante.
De una ojeada al código inferior para ver como llama cada
elemento a las funciones de los distintos script.
<![CDATA[
<body onLoad="arranque()">
<h2>Como Registrar y Guardar datos de un Usuario</h2>
<h4>Vamos a crear una cuenta de Usuario verdadera</h4>
<table width="553" border="0"><form action="crearcuenta.php"
method="post"name="formulario" onSubmit=" return TestaVal()" >
<tr>
<td width="157">Nombre de Usuario</td>
<td width="251"> <input type="text" name="nombre" id="campo" size="40" maxlength="100"
onKeyPress="return validar_textoc(event)" placeholder="Sin mayusculas ni espacios en blanco">
<br /></td><td width="222"></td></tr><tr><td>
E-mail </td>
<td><a href="#" onMouseOver="return overlib('Escriba su E-Mail y CLCK en el Icono Crear');
</strong> onMouseOut="return nd();"><input type="text" name="email" size="40" id="email"
maxlength="100" placeholder="Correo Electrónico" onkeyup="validarEmail(this)"
onKeyPress="return validar_textob(event)"></a></td><td>
<input type= 'text' id="resultado" name ="resultado" size="20"
style="background: url(borralinea1.ico); background-repeat:no-repeat; background-color:transparent;
outline: none; bottom: 2px; padding: 2px; top:2px; position: relative; border: 0px;
width: 180px; font-size:14px; font-style:oblique; color: #F00; width:auto"/></td> </tr><tr> <td>Contraseña</td>
<td> <input type="text" name="password" id="campo1" size="40" maxlength="60" placeholder="Escriba su ID"
onKeyPress="return validar_textoa(event)" ></td><td></td></tr><tr>
<td><input type="submit" Style="font-family:Arial; font-size:24; color:black;" value="Enviar Datos" /> </td>
<td></td><td></td>
</tr>
</form>
</table>
]]>