ユーザーにパスワードの設定を求めるオンライン フォームを作成する場合は、パスワードの確認フィールドを含める必要があります。パスワード フィールドはデフォルトでユーザーの入力を非表示にするため、ユーザーがタイプミスをすることなく正しいパスワードを書いたことを確認できる何らかのメカニズムが必要になります。パスワードの確認フィールドでは、ユーザーが文字の入力を間違えた場合にパスワードを再確認するように求められ、パスワードとパスワードの確認フィールドが一致しません。
この投稿での目標は、ユーザーの入力に一致する HTML フォームを作成することです。 パスワード と パスワードを認証する ユーザーが正しいパスワードを入力したか、入力ミスがないかを確認するためのフィールド。
ステップ 1: HTML フォーム
最初のステップは、ユーザーの入力を受け取る HTML フォームを作成することです。
< 中心 >
< h2 > Linux ヒント h2 >
< 形 >
< p > パスワードを入力する p >
< 入力 タイプ = 'パスワード' ID = '合格' > < br >< br >
< p > パスワードを認証する p >
< 入力 タイプ = 'パスワード' ID = 「確認パス」 > < br >< br >
< ボタン タイプ = '参加する' オンクリック = 「パスワード確認()」 > ログ の ボタン >
形 >
中心 >
パスワード タイプの 2 つの入力フィールドと、 パスワード確認() クリックしたときに機能します。
ステップ 2: JavaScript フォームの検証
次に、JavaScript コードを パスワード確認() パスワードを検証する関数:
関数 パスワード確認 ( ) {
var password = document.getElementById ( '合格' ) 。価値;
var confirmPassword = document.getElementById ( 「確認パス」 ) 。価値;
もしも ( パスワード== '' ) {
アラート ( 「エラー: パスワード フィールドが空です。」 ) ;
} そうしないと もしも ( パスワード == パスワードの確認 ) {
アラート ( 「ログインしました」 ) ;
} そうしないと {
アラート ( 「パスワードが一致していることを確認してください。」 )
}
}
内部 パスワード確認() 関数では、最初に password フィールドと Confirm password フィールドの値を取得し、それらを変数内に格納します。次に、条件文を使用してさまざまなケースをチェックします。
ケース 1: パスワード フィールドが空です
最初の条件は、パスワード フィールドが空かどうかをチェックします。フィールドが空の場合、ユーザーにパスワードを入力するように求めます。
ケース 2: パスワードが一致する
パスワードが一致し、ユーザーが正常にログインした場合:
ケース 3: パスワードが一致しない
パスワードが一致しない場合は、ユーザーにパスワードを再入力して一致することを確認するように求めます。
JavaScript と HTML コードを合わせると、次のようになります。
< html >
< 体 >
< 中心 >
< h2 > Linux ヒント h2 >
< 形 >
< p > パスワードを入力する p >
< 入力 タイプ = 'パスワード' ID = '合格' > < br >< br >
< p > パスワードを認証する p >
< 入力 タイプ = 'パスワード' ID = 「確認パス」 > < br >< br >
< ボタン タイプ = '参加する' オンクリック = 「パスワード確認()」 > ログ の ボタン >
形 >
中心 >
体 >
< 脚本 >
関数 パスワード確認 ( ) {
var password = document.getElementById ( '合格' ) 。価値;
var confirmPassword = document.getElementById ( 「確認パス」 ) 。価値;
もしも ( パスワード== '' ) {
アラート ( 「エラー: パスワード フィールドが空です。」 ) ;
} そうしないと もしも ( パスワード == パスワードの確認 ) {
アラート ( 「ログインしました」 ) ;
} そうしないと {
アラート ( 「パスワードが一致していることを確認してください。」 )
}
}
脚本 >
html >
結論
人間はしばしば間違いを犯す可能性がありますが、それでアカウントへのログインが妨げられるべきではありません。パスワードの入力を少し間違えただけでも、ユーザーのアカウントへのアクセスが制限される可能性があります。そのため、ユーザーのパスワードを再確認して、正しいパスワードを入力したことを確認することをお勧めします。