Los campos de confirmación de contraseña son necesarios para incluirlos al crear formularios en línea que soliciten a los usuarios que establezcan una contraseña. El campo de contraseña oculta la entrada del usuario por defecto, por lo que es necesario tener algún tipo de mecanismo que permita a los usuarios confirmar que han escrito la contraseña correcta sin cometer errores tipográficos. El campo de confirmación de contraseña solicita al usuario que vuelva a verificar su contraseña si escribe mal algún carácter y los campos de contraseña y confirmación de contraseña no coinciden.
En esta publicación, nuestro objetivo es crear un formulario HTML que coincida con la entrada del usuario en el Clave y Confirmar contraseña campos para confirmar si el usuario ha escrito la contraseña correcta o ha cometido errores tipográficos.
Paso 1: Formulario HTML
El primer paso es hacer un formulario HTML que tome la entrada del usuario:
< centro >
< h2 > Sugerencia de Linux h2 >
< forma >
< pags > Introducir la contraseña pags >
< aporte escribe = 'clave' identificación = 'pasar' > < hermano >< hermano >
< pags > Confirmar contraseña pags >
< aporte escribe = 'clave' identificación = 'confirmar pase' > < hermano >< hermano >
< botón escribe = 'enviar' al hacer clic = 'confirmación de contraseña()' > Tronco en botón >
forma >
centro >
Hemos creado un formulario HTML simple que tiene dos campos de entrada de tipo contraseña y un botón de inicio de sesión que llama al confirmación de contraseña() función cuando se hace clic en él.
Paso 2: Validación de formulario JavaScript
Ahora escribiremos código JavaScript dentro del confirmación de contraseña() función que valida la contraseña:
función confirmación de contraseña ( ) {
var contraseña = documento.getElementById ( 'pasar' ) .valor;
var confirmPassword = documento.getElementById ( 'confirmar pase' ) .valor;
si ( contraseña == '' ) {
alerta ( 'Error: el campo de la contraseña está vacío'. ) ;
} más si ( contraseña == confirmar contraseña ) {
alerta ( 'Conectado' ) ;
} más {
alerta ( 'Por favor, asegúrese de que sus contraseñas coinciden.' )
}
}
Dentro de confirmación de contraseña() primero obtenemos los valores de contraseña y confirmamos los campos de contraseña y los almacenamos dentro de las variables. Luego usamos declaraciones condicionales para verificar diferentes casos.
Caso 1: el campo de contraseña está vacío
El primer condicional comprueba si el campo de la contraseña está vacío. Solicitamos al usuario que escriba la contraseña si el campo está vacío:
Caso 2: Coincidencia de contraseñas
En caso de que las contraseñas coincidan, el usuario inicia sesión correctamente:
Caso 3: Las contraseñas no coinciden
Si las contraseñas no coinciden, le pedimos al usuario que vuelva a escribir las contraseñas y se asegure de que coincidan:
El código JavaScript y HTML juntos se parece a esto:
< html >
< cuerpo >
< centro >
< h2 > Sugerencia de Linux h2 >
< forma >
< pags > Introducir la contraseña pags >
< aporte escribe = 'clave' identificación = 'pasar' > < hermano >< hermano >
< pags > Confirmar contraseña pags >
< aporte escribe = 'clave' identificación = 'confirmar pase' > < hermano >< hermano >
< botón escribe = 'enviar' al hacer clic = 'confirmación de contraseña()' > Tronco en botón >
forma >
centro >
cuerpo >
< guion >
función confirmación de contraseña ( ) {
var contraseña = documento.getElementById ( 'pasar' ) .valor;
var confirmPassword = documento.getElementById ( 'confirmar pase' ) .valor;
si ( contraseña == '' ) {
alerta ( 'Error: el campo de la contraseña está vacío'. ) ;
} más si ( contraseña == confirmar contraseña ) {
alerta ( 'Conectado' ) ;
} más {
alerta ( 'Por favor, asegúrese de que sus contraseñas coinciden.' )
}
}
guion >
html >
Conclusión
Los humanos a menudo pueden cometer errores, pero eso no debería impedirles iniciar sesión en sus cuentas. Incluso el más mínimo error al ingresar una contraseña puede restringir el acceso de un usuario a su cuenta. Por lo tanto, siempre es una buena idea verificar dos veces la contraseña de un usuario para confirmar que ingresó la correcta.