Bekreft passordfelt er nødvendig å inkludere når du lager elektroniske skjemaer som ber brukere angi et passord. Passordfeltet skjuler brukerens input som standard, noe som gjør det nødvendig å ha en slags mekanisme som lar brukere bekrefte at de har skrevet riktig passord uten å skrive feil. Bekreft passord-feltet ber brukeren om å sjekke passordet på nytt hvis de skriver feil tegn og passord- og bekreftelsespassord-feltene ikke samsvarer.
I dette innlegget er målet vårt å lage et HTML-skjema som samsvarer med brukerens input i Passord og bekreft passord felt for å bekrefte om brukeren har skrevet inn riktig passord eller har skrevet feil.
Trinn 1: HTML-skjema
Det første trinnet er å lage et HTML-skjema som tar brukerens innspill:
< senter >
< h2 > Linux hint h2 >
< form >
< s > Oppgi passord s >
< input type = 'passord' id = 'sende' > < br >< br >
< s > bekreft passord s >
< input type = 'passord' id = 'bekreftpass' > < br >< br >
< knapp type = 'sende inn' ved trykk = 'Passord bekreftelse()' > Logg i knapp >
form >
senter >
Vi har laget et enkelt HTML-skjema som har to inntastingsfelt med type passord og en påloggingsknapp som kaller opp Passord bekreftelse() funksjon når den klikkes.
Trinn 2: JavaScript-skjemavalidering
Nå skal vi skrive JavaScript-kode inne i Passord bekreftelse() funksjon som validerer passordet:
funksjon Passord bekreftelse ( ) {
var passord = document.getElementById ( 'sende' ) .verdi;
var confirmPassword = document.getElementById ( 'bekreftpass' ) .verdi;
hvis ( passord == '' ) {
varsling ( 'Feil: Passordfeltet er tomt.' ) ;
} ellers hvis ( passord == bekreftPassord ) {
varsling ( 'Logget inn' ) ;
} ellers {
varsling ( 'Vennligst sørg for at passordene dine samsvarer.' )
}
}
Inne i Passord bekreftelse() funksjon får vi først verdiene til passord og bekrefter passordfelt og lagrer dem i variabler. Vi bruker deretter betingede utsagn for å se etter ulike saker.
Tilfelle 1: Passordfeltet er tomt
Den første betingelsen kontrollerer om passordfeltet er tomt. Vi ber brukeren skrive inn passordet hvis feltet er tomt:
Tilfelle 2: Passord samsvarer
Hvis passordene samsvarer, logger brukeren på:
Tilfelle 3: Passord stemmer ikke
Hvis passordene ikke stemmer, ber vi brukeren skrive inn passordene på nytt og sørge for at de samsvarer:
JavaScript og HTML-koden sammen ser omtrent slik ut:
< html >
< kropp >
< senter >
< h2 > Linux hint h2 >
< form >
< s > Oppgi passord s >
< input type = 'passord' id = 'sende' > < br >< br >
< s > bekreft passord s >
< input type = 'passord' id = 'bekreftpass' > < br >< br >
< knapp type = 'sende inn' ved trykk = 'Passord bekreftelse()' > Logg i knapp >
form >
senter >
kropp >
< manus >
funksjon Passord bekreftelse ( ) {
var passord = document.getElementById ( 'sende' ) .verdi;
var confirmPassword = document.getElementById ( 'bekreftpass' ) .verdi;
hvis ( passord == '' ) {
varsling ( 'Feil: Passordfeltet er tomt.' ) ;
} ellers hvis ( passord == bekreftPassord ) {
varsling ( 'Logget inn' ) ;
} ellers {
varsling ( 'Vennligst sørg for at passordene dine samsvarer.' )
}
}
manus >
html >
Konklusjon
Mennesker kan ofte gjøre feil, men det bør ikke hindre dem i å logge på kontoene sine. Selv den minste feil ved å skrive inn et passord kan begrense en brukers tilgang til kontoen deres. Så det er alltid en god idé å dobbeltsjekke en brukers passord for å bekrefte at de har skrevet inn det riktige.