Tengo un formulario en una página HTML con un script que revisa los campos del formulario, el problema es que cada vez que escribo algo "incorrecto" en el campo y el script da una alert() , todos los campos del formulario se borran .
Aquí está el código:
<html> <head> <title>Login</title> <link rel="stylesheet" href="style.css"> <link rel="icon" href="loginIcon.png"> <script src="script.js"></script> </head> <body> <form id="form" method="POST"> <div class="center"><input type="text" placeholder="E-mail" id="email" name="email"></div> <div class="center"><input type="password" placeholder="Password" id="pass" name="pass"></div> <div><input type="checkbox" class="check" id="check"> I'm not a Robot</div> <div class="center"><button onclick="check()">LOGIN</button></div> <a href="#">Don't have an account yet? Sign Up</a> </form> </body> </html>Y el guión:
function check() { var em = document.getElementById("email").value.trim() var ps = document.getElementById("pass").value.trim() var ch = document.getElementById("check") if (ch.checked) { if (em == "" || em == undefined) { alert("Email missing") return false } else if (ps == "" || ps == undefined) { alert("Password missing") return false } else { if (!em.includes("@")) { alert("Missing '@'") return false } else if (ps.length > 16) { alert("Password must be 16 characters or less") return false } else { document.getElementById("form").action = "check.php" } } } else { alert("You're a Robot!") return false } }Cambia tu formulario a este
<form id="form" action="check.php" method="POST" onsubmit="return check()"> <div class="center"><input type="text" placeholder="E-mail" id="email" name="email"></div> <div class="center"><input type="password" placeholder="Password" id="pass" name="pass"></div> <div><input type="checkbox" class="check" id="check"> I'm not a Robot</div> <div class="center"><button type="submit">LOGIN</button></div> <a href="#">Don't have an account yet? Sign Up</a> </form>En este momento, el formulario se envía después de la alerta, debe tener este evento en el envío del formulario para que, en caso de que sea falso, se detenga el envío del formulario.
onsubmit recibe un booleano (verdadero de forma predeterminada), por lo que si devuelve falso desde la función, el envío se detendrá (como se hace aquí).