Haga clic en Verificar dirección de correo electrónico – JavaScript – Foros de SitePoint
Tengo una contraseña de verificación que confirma que funciona bien, ver más abajo.
Quiero agregar validación al correo electrónico, pero no sé cómo agregarlo a la entrada onclick.
La dirección de correo electrónico te lo pedirá.
Aprecio tu ayuda.
Email Address:
Retype Email Address:
Administration Password:
Retype Password:
hola,
¿Puedes explicar qué quieres decir con “verificar”?
Verificar el formato de la dirección de correo electrónico con expresiones regulares es muy difícil.
Personalmente, establecería el tipo de entrada en “correo electrónico” y el navegador lo hará por usted:
Cambie su entrada a la anterior, luego intente enviar el formulario con una dirección de correo electrónico no válida.
Si, ya tengo el regex, lo que busco es asegurarme coincide con la misma dirección de correo electrónico se escribirá en este campo primero. Eso es lo que hace el campo de contraseña. No sé cómo agregar el código correcto a la contraseña de verificación ya codificada.
No, lo tengo. El OP quiere implementar una funcionalidad similar para los campos de correo electrónico (es decir, verificar que los valores enviados sean los mismos) antes de permitir que se envíe el formulario.
Algunas ideas sobre el código y la tarea que publicaste.
- No debe usar tablas con fines de diseño.
- Para accesibilidad, debe usar etiquetas para los campos de su formulario (esta es la razón)
- La validación de JavaScript se puede omitir fácilmente. También debe verificar esto en el servidor.
- Para ser honesto, encuentro tales cheques un poco molestos. Si desea asegurarse de que la persona no haya ingresado su dirección de correo electrónico incorrectamente, envíele un correo electrónico de confirmación con un enlace. Deben hacer clic en el enlace para confirmar que tienen una dirección de correo electrónico.
- No soy fanático de JavaScript en línea (es decir,
onclick="do-stuff; do more stuff; and more stuff;"
). Es difícil de leer y retener. Esto realmente debería moverse a su propio archivo.
Dicho todo esto, ¿cómo voy a completar la tarea. He copiado todo el código (HTML profesional) para que puedas ejecutarlo en tu computadora y jugar con él.
Form validation example
1 Me gusta
He usado etiquetas antes. Este es un formulario antiguo hecho por un desarrollador certificado de MS y fue muy bueno. Pero tal vez ahora hay una mejor manera de hacerlo. Hice un pequeño cambio en algo que funcionaba bien, así que quise agregar un corrector ortográfico de correo electrónico porque los usuarios tienden a escribir mal incluso sus direcciones de correo electrónico. Es un formulario de registro que envía un correo electrónico para activar su cuenta, y si el correo electrónico es incorrecto, son solo llamadas telefónicas no deseadas, etc. causa tales problemas. Por lo tanto, evita que esto suceda.
La validación se verifica en el servidor, pero esto evita errores tipográficos. No estoy preocupado por la omisión de JS en este sitio en particular. Pero como todo el mundo, tienes una opinión válida al respecto.
Estoy de acuerdo en que puede ser molesto, pero creo que los usuarios están acostumbrados. La mayoría de las instituciones financieras verifican tanto el correo electrónico como la contraseña.
Lo que pensé que sería una adición fácil resultó ser un desastre. Pero como se mencionó antes, lo hizo un codificador extremadamente bueno y yo quería hacer el mismo cambio.
Miraré tus muestras y jugaré con ellas. Lo aprecio y también hago las cosas de la mejor manera posible.
Muchísimas gracias
Parece que el texto después de la primera advertencia debería ser un comentario de JavaScript.
Bueno, hagamos algo que puedas poner en la página y trabajar.
Todo está pasando ahora mismo onsubmit
acción en su botón:
Podemos simplificarlo así:
Para asegurarse de que las contraseñas coincidan, el código se puede extender a:
(function(){
if(document.forms[0]['txtPassword'].value != document.forms[0]['txtPasswordVerify'].value){
alert('Please make sure passwords match!');
document.forms[0]['txtPasswordVerify'].value="";
document.forms[0]['txtPassword'].value="";
document.forms[0]['txtPasswordVerify'].style.borderColor="red";
document.forms[0]['txtPassword'].style.borderColor="red";
} else {
document.forms[0].submit();
}
})()
Esto funciona, pero necesitamos modificar un poco la lógica:
(function(){
if (passwords don't match){
alert('Please make sure passwords match!');
...
}
if (emails don't match) {
alert('Please make sure emails match!');
...
}
Otherwise submit the form
})()
En el código, puedes hacer esto así:
(function(){
var isValid = true;
if (document.forms[0]['txtPassword'].value != document.forms[0]['txtPasswordVerify'].value) {
alert('Please make sure passwords match!');
document.forms[0]['txtPasswordVerify'].value="";
document.forms[0]['txtPassword'].value="";
document.forms[0]['txtPasswordVerify'].style.borderColor="red";
document.forms[0]['txtPassword'].style.borderColor="red";
isValid = false;
}
if (document.forms[0]['txtEmail'].value != document.forms[0]['txtEmailVerify'].value) {
alert('Please make sure email addresses match!');
document.forms[0]['txtEmail'].style.borderColor="red";
document.forms[0]['txtEmailVerify'].style.borderColor="red";
isValid = false;
}
if (isValid) document.forms[0].submit();
})();
Tenga en cuenta que no restablezco el valor en los campos de correo electrónico si los valores no coinciden (como en los campos de contraseña).
Luego, lo último que debe hacer es eliminar los espacios y adjuntarlo a una cadena:
Te lo dá:
Prueba esto y hazme saber si funciona