SHOW:
|
|
- or go back to the newest paste.
| 1 | <!DOCTYPE html> | |
| 2 | <html> | |
| 3 | <head> | |
| 4 | <title>Boton</title> | |
| 5 | - | a:link, a:visited, a:active { color:#666666; text-decoration:none; }
|
| 5 | + | |
| 6 | - | a:hover { color:#333333; text-decoration:none; }
|
| 6 | + | a:link, a:visited, a:active { color:black; text-decoration:none; }
|
| 7 | - | .asterisco{ color:red; }
|
| 7 | + | a:hover { color:#00F; text-decoration:none; }
|
| 8 | - | th {border:none;}
|
| 8 | + | .asterisco{color:red;}
|
| 9 | - | td { border: 1px solid black;}
|
| 9 | + | p{text-align:center;}
|
| 10 | - | input[type="text"],input[type="password"]{border:none;}
|
| 10 | + | dt,dd{display:inline-block;}
|
| 11 | dt{width:8em;}
| |
| 12 | input[type=submit], input[type=reset]{margin-left:12em;}
| |
| 13 | input:invalid {box-shadow: 0 0 5px 1px red;}
| |
| 14 | input:focus:invalid { outline: none;}
| |
| 15 | </style> | |
| 16 | <script type="text/javascript"> | |
| 17 | function verificaCampos() {
| |
| 18 | // Creamos variables para los campos a verificar | |
| 19 | nombre = document.getElementById("nombre");
| |
| 20 | dni = document.getElementById("dni");
| |
| 21 | - | alert("Tiene que escribir su nombre");
|
| 21 | + | |
| 22 | passwd2 = document.getElementById("pass2");
| |
| 23 | //Comprueba que el nombre no esté vacío | |
| 24 | if (nombre.value.length == 0) {
| |
| 25 | alert("Tiene que escribir su nombre");
| |
| 26 | nombre.focus(); | |
| 27 | return (false); } | |
| 28 | // NÚMEROS, comprueba que el dni solo tiene números | |
| 29 | if (isNaN(dni.value) == true) {
| |
| 30 | alert ("el dni tiene que ser solo numérico");
| |
| 31 | - | alert("Escriba entre 7 y 8 números en el campo \"DNI\".");
|
| 31 | + | |
| 32 | dni.focus(); | |
| 33 | return (false); } | |
| 34 | - | return (false); } |
| 34 | + | |
| 35 | alert("Escriba entre 7 y 8 números en el campo \"DNI\".");
| |
| 36 | dni.value=""; | |
| 37 | - | alert("Tiene que escribir su clave") ;
|
| 37 | + | |
| 38 | return (false); } | |
| 39 | //Comprueba que el campo clave no este vacio | |
| 40 | if (passwd1.value.length == 0) {
| |
| 41 | alert("Tiene que escribir su clave") ;
| |
| 42 | passwd1.focus(); | |
| 43 | return (false); } | |
| 44 | //Para que compare si las claves son iguales | |
| 45 | if (passwd1.value != passwd2.value) {
| |
| 46 | alert("Las dos claves son distintas") ;
| |
| 47 | passwd2.value=""; | |
| 48 | passwd2.focus(); | |
| 49 | - | </head> |
| 49 | + | |
| 50 | - | <body> |
| 50 | + | |
| 51 | - | <form action="p1.php" method="post" name="formulario" onsubmit="return verificaCampos()"> |
| 51 | + | |
| 52 | - | <table align=center> |
| 52 | + | window.onload=function() {
|
| 53 | - | <tr> |
| 53 | + | formu = document.getElementsByTagName("form")[0];
|
| 54 | - | <th> Nombre: <span class="asterisco">*</span> </th> |
| 54 | + | formu.setAttribute("onsubmit","return verificaCampos()");
|
| 55 | - | <td colspan=2><input type="text" value="" name="nombre" id="nombre" size="60"></td> |
| 55 | + | } |
| 56 | - | </tr> |
| 56 | + | |
| 57 | - | <tr> |
| 57 | + | </head> |
| 58 | - | <th> Apellidos: </th> |
| 58 | + | <body> |
| 59 | - | <td colspan=2><input type="text" value="" name="apellidos" size="60" ></td> |
| 59 | + | <form action="p1.php" method="post" name="formulario"> |
| 60 | - | </tr> |
| 60 | + | <dl> |
| 61 | - | <tr> |
| 61 | + | <dt><label for="nombre">Nombre<span class="asterisco">*</span>:</label></dt> |
| 62 | - | <th> DNI: <span class="asterisco">*</span> </th> |
| 62 | + | <dd><input type="text" required="required" value="" name="nombre" id="nombre" size="60" /></dd><br /> |
| 63 | - | <td style="width:12em;"><input type="text" value="" name="dni" id="dni" ></td> |
| 63 | + | <dt><label for="apellidos">Apellidos:</label></dt> |
| 64 | - | </tr> |
| 64 | + | <dd><input type="text" value="" name="apellidos" id="apellidos" size="60" /></dd> <br /> |
| 65 | - | <tr> |
| 65 | + | <dt><label for="dni">DNI<span class="asterisco">*</span>:</label></dt> |
| 66 | - | <th> Clave: <span class="asterisco">*</span> </th> |
| 66 | + | <dd><input type="text" required="required" value="" name="dni" id="dni" pattern="\d{8,9}" /></dd><br />
|
| 67 | - | <td><input type="password" value="" name="pass1" id="pass1" ></td> |
| 67 | + | <dt><label for="pass1">Clave<span class="asterisco">*</span>:</label></dt> |
| 68 | - | </tr> |
| 68 | + | <dd><input type="password" value="" name="pass1" id="pass1" required="required" /></dd><br /> |
| 69 | - | <tr> |
| 69 | + | <dt><label for="pass2">Repita la clave<span class="asterisco">*</span>:</label></dt> |
| 70 | - | <th> Repite la clave: </th> |
| 70 | + | <dd><input type="password" value="" name="pass2" id="pass2" required="required" /></dd> |
| 71 | - | <td> <input type="password" value="" name="pass2" id="pass2" ></td> |
| 71 | + | </dl> |
| 72 | - | </tr> |
| 72 | + | <input type="submit" name="enviar" value="Enviar" /><input type="reset" name="borrar" value="Borrar" /> |
| 73 | - | <tr> |
| 73 | + | <hr /> |
| 74 | - | <th colspan=3 align="center"> <br><input style="margin-right:8em;" type="submit" name="enviar" value="Enviar" ><input type="reset" name="borrar" value="Borrar"></th> |
| 74 | + | <p><a href="http://www.misitioweb.com">Visita mi Sitio Web</a></p> |
| 75 | - | </tr> |
| 75 | + | </form> |
| 76 | - | <tr> |
| 76 | + | </body> |
| 77 | - | <th colspan=3 align="center"><hr> <a href="http://www.misitioweb.com">Visita mi Sitio Web</a> </th> |
| 77 | + |
