API tools faq
paste
Advertisement
Guest User

texto interno label desaparece

a guest
Jan 20th, 2020
101
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 4.39 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="es">
  3.     <head>
  4.         <meta charset="UTF-8">
  5.         <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.         <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7.         <title>5.5-6</title>
  8.         <style>
  9.             form{
  10.                   text-align: center;
  11.             }
  12.             fieldset{
  13.                   margin: 1em;
  14.                   padding: 1em;
  15.             }
  16.             label{
  17.                   color:red;
  18.             }
  19.         </style>
  20.     </head>
  21.     <body>
  22.           <form>
  23.             <fieldset>
  24.                   <legend>Credenciales</legend>
  25.                   Nombre <input type="text" id="nombre"> <br>
  26.                   <label id="nomErr"></label> <br><br>
  27.                   Contraseña <input type="password" id="contraseña">
  28.                   <label id="passErr"></label> <br><br>
  29.             </fieldset>
  30.             <fieldset>
  31.                   <legend>Colores Favoritos</legend>
  32.                   <input type="checkbox" id="rojo">Rojo
  33.                   <input type="checkbox" id="azul">Azul
  34.                   <input type="checkbox" id="verde">Verde
  35.                   <input type="checkbox" id="morado">Morado
  36.                   <input type="checkbox" id="violeta">Violeta
  37.                   <input type="checkbox" id="amarillo">Amarillo
  38.                   <input type="checkbox" id="rosa">Rosa
  39.                   <input type="checkbox" id="gris">Gris
  40.                   <label id="coloresErr"></label> <br><br>
  41.             </fieldset>
  42.             <fieldset>
  43.                   <legend>Género</legend>
  44.                   <input type="radio" name="gen" id="Hombre">Hombre
  45.                   <input type="radio" name="gen" id="Mujer">Mujer
  46.                   <label id="generoErr"></label> <br><br>
  47.             </fieldset>
  48.             <fieldset>
  49.                   <legend>Introduce la ruta del fichero</legend>
  50.                   Fichero adjunto <input type="file" id="adjunto">
  51.                   <label id="adjuntoErr"></label> <br><br>
  52.             </fieldset>
  53.             <button id="validar">Valida</button>
  54.             <button id="addCook">Escribe Cookies</button>
  55.             <button id="showAllCook">Muestra Cookies</button>
  56.             <button id="delCook">Borra Cookies</button>
  57.             <button id="showCook">Consulta una cookie</button>
  58.             <input type="reset" value="Borra información">
  59.           </form>
  60.     </body>
  61.     <script type="application/javascript">
  62.       document.getElementById("validar").addEventListener("click",validar);
  63.       document.getElementById("addCook").addEventListener("click",addCook);
  64.       document.getElementById("showAllCook").addEventListener("click",showAllCook);
  65.       document.getElementById("delCook").addEventListener("click",delCook);
  66.       document.getElementById("showCook").addEventListener("click",showCook);
  67.  
  68.       var nomErr = document.getElementById("nomErr");
  69.       function validar() { //validar all form with ExpReg Mostrar mensajes de Error
  70.             // NOMBRE
  71.             var nom = document.getElementById("nombre");
  72.             var nomVal = false;
  73.             let ExpRNom = /[a-zA-Z]{4}/; //condición minima a cumplir  TRUE si >4 letras??
  74.             ExpRNom.test(nom.value) ? nomVal = true : nomVal = false
  75.             debugger;
  76.             nomVal ? nomErr.innerText = '' : nomErr.innerText = 'Tiene que tener mínimo 4 letras!'
  77.  
  78.             var pass = document.getElementById("contraseña");
  79.             var passErr = document.getElementById("passErr");
  80.  
  81.             var coloresErr = document.getElementById("coloresErr");
  82.  
  83.             var genero = document.getElementById("gen");
  84.             var genErr = document.getElementById("generoErr");
  85.  
  86.             var archivo = document.getElementById("adjunto");
  87.             var adjuntoErr = document.getElementById("adjuntoErr");
  88.       }
  89.       function addCook(params) { //crear cookie
  90.            
  91.       }
  92.       function showAllCook(params) { //Alert
  93.            
  94.       }
  95.       function delCook(params) {
  96.            
  97.       }
  98.       function showCook(params) { //buscar por nombre INPUT => Alert
  99.            
  100.       }
  101.     </script>
  102. </html>
  103. <!--nombre: Min 4 letras
  104. pass: Mayus, Minus, nums(1 de cada min)
  105. checkbox: minimo select 4
  106. genero: REQUIRED
  107. file: REQUIED
  108.  
  109.   -- -- -- -- -- -- -- -- -- -- -- --
  110. Al borrar todas cookies(cookies = 0), MOSTRAR COOKIES => Alert: No hay cookies
  111.   -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!