이번 장에서는 JavaScript를 사용한 비밀번호 검증에 대해 설명합니다. 사용자가 웹사이트나 앱에서 계정을 만들 때마다 비밀번호를 확인해야 합니다. 따라서 유효한 비밀번호를 확인하고 비밀번호 확인 유효성 검사도 수행해야 합니다. 유효한 비밀번호의 경우 다음 매개변수가 포함되어야 유효합니다.
누가 학교를 만들었나
- 비밀번호는 영숫자여야 합니다.
- 비밀번호의 첫 글자는 대문자여야 합니다.
- 비밀번호에는 특수 문자(@, $, !, & 등)가 포함되어야 합니다.
- 비밀번호 길이는 8자보다 커야 합니다.
- 비밀번호 필드를 비워두지 말아야 하는 가장 중요한 사항 중 하나입니다.
사용자가 비밀번호를 생성할 때마다 항상 비밀번호 확인 필드가 하나 더 추가됩니다. 사용자가 입력한 비밀번호가 비밀번호 확인 필드와 동일한지 확인합니다. 유효한 비밀번호를 생성하려면 비밀번호와 비밀번호 확인 필드 값이 모두 일치해야 합니다.
먼저 유효한 비밀번호를 확인한 다음 비밀번호 유효성 검사를 확인합니다.
유효한 비밀번호 확인
이 예에서는 사용자가 생성한 비밀번호가 유효한지, 위에서 설명한 모든 매개변수와 일치하는지 확인합니다. 비밀번호 확인은 아래 코드를 참고하세요.
코드 복사
Verification of valid Password function verifyPassword() { var pw = document.getElementById('pswd').value; //check empty password field if(pw == '') { document.getElementById('message').innerHTML = '**Fill the password please!'; return false; } //minimum password length validation if(pw.length 15) { document.getElementById('message').innerHTML = '**Password length must not exceed 15 characters'; return false; } else { alert('Password is correct'); } } <h3> Verify valid password Example </h3> <td> Full Name* </td> <span id="blankMsg"> </span> <br> <br> <td> Last Name </td> <span id="charMsg"> </span> <br> <br> <td> Create Password* </td> <span id="message1"> </span> <br> <br> <td> Confirm Password* </td> <span id="message2"> </span> <br> <br> Reset 지금 테스트해보세요 산출
위의 코드를 실행하면 HTML 양식이 웹에 나타납니다. 여기에서 텍스트 필드에 데이터를 제공하고 제출 버튼을 클릭하여 처리합니다. 유효성 검사에 따르면 데이터가 정확하면 다음 메시지가 포함된 경고 상자가 나타납니다. 귀하의 비밀번호가 생성되었습니다 성공적으로. 여기를 클릭하시면 좋아요 버튼을 누르면 다른 출력으로 이동합니다.
스크린샷 1
자바 생성 목록
다음을 클릭하면 좋아요 경고 상자 안의 버튼을 클릭하면 간단한 HTML 출력으로 이동하여 메시지가 표시됩니다. 양식 데이터가 성공적으로 제출되었습니다. .
스크린샷 2
잘못된 항목 제공에 대한 출력
잘못된 값을 입력하거나 필수 항목을 비워두면 입력 상자 오른쪽에 오류가 표시됩니다. 이러한 오류는 클릭할 때마다 유효성 검사가 완료된 후 하나씩 표시됩니다. 제출하다 단추. 아래 스크린샷의 오류를 참조하세요.
모든 유효성 검사가 올바르게 작동하는지 확인하려면 코드를 복사하여 JavaScript 컴파일러에서 실행하세요.
자바 컬렉션 자바