[13] JavaScript & JQuery - 아이디, 비밀번호 유효성 체크

[ 환경 ]
ㄴ php 7 
ㄴ JQuery 1.11.1

Q. 아이디는 6자이상 20자미만

Q. 비밀번호는 8자이상 20자이하 & 영문,숫자,특수문자 포함

 

※ 정규표현식, length 함수 사용

 

---

 

1. JQuery 코드

<script>
	$(function(){
		// 회원가입 진행
		$(".joinBtn").click(function(){
		    var id = $(".id").val(); // 아이디
		    var password = $(".password").val(); // 비밀번호

            // 비밀번호 규칙체크
            var check = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]/; // 영문,숫자,특수문자 포함정규식
	        if(!check.test(password)) {
	            alert("비밀번호는 영문&숫자&특수문자를 다 포함하셔야합니다.");
	            return false;
	        }
	        // 비밀번호 길이체크
	        if(password.length < 8 || password.length > 20){
	            alert("비밀번호는 8자이상 20자이하로 입력해주셔야 합니다.");
	            return false;
	        }

	        // 아이디 길이체크
	        if(id.length != 10){
	            alert("아이디는 무조건 10자리를 입력해주시기 바랍니다.");
	            return false;
	        }
		})
	})	
</script>

ㄴ check변수를 만들어서 정규식으로 체크 유효성체크 조건문 생성

ㄴ length함수로 아이디,비밀번호 길이 체크 유효성체크 조건문 생성

 

2. 사이트(기능) 확인

 

ㄴ Q. 아이디는 6자이상 20자미만

ㄴ Q. 비밀번호는 8자이상 20자이하 & 영문,숫자,특수문자 포함

ㄴ 정상 작동완료