FrontEnd/Javascript

회원가입 유효성 검사

berryberries 2023. 6. 5. 08:43
$(document).ready(function(){

	// 정규식
    let checkID = RegExp(/^[a-zA-Z0-9]{6,20}$/);
    let checkPW = RegExp(/^(?=.*[a-zA-Z])(?=.*[!@#$%^*+=-])(?=.*[0-9]).{8,15}$/);
    let checkName = RegExp(/^[가-힣]|[A-Z]|[a-z]$/);
    let checkPhone = RegExp(/^\d{3}\d{3,4}\d{4}$/);        
    let checkEmail = RegExp(/^([a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})$/);
         
    

	$('#userId').blur(function() {
		var userId = $('#userId').val();
	
		if(userId === ''){
			$('#id_msg').html('아이디를 입력해 주세요');	
			$('#id_msg').css('color','red');
// 			$("#userId").focus();
			return false;
			
		}else if(!checkID.test(userId)) {
			$('#id_msg').html("대소문자,숫자를 포함한 6자리~20자리로 입력해주세요.");
			$('#id_msg').css('color','red');
//             $("#userId").focus();                
            return false;
            
        }else if(checkID.test(userId)) {
        	$('#id_msg').html("사용가능한 아이디입니다.")
        	$('#id_msg').css("color", "#3f8ef7");                           
//         	$("#userPw").focus();
        	return true;
        }
    }); //$('#userId').blur end
		
	$('#userPw').blur(function() {
		var userPw = $('#userPw').val();
	
		if(userPw === ''){	
			$('#pw_msg').html('비밀번호를 입력해 주세요');
			$('#pw_msg').css('color','red');
// 			$("#userPw").focus();
			return false;
		}else if(!checkPW.test(userPw)){
			$('#pw_msg').html('대소문자,특수문자 포함한 8자리~15자리로 입력해주세요');
			$('#pw_msg').css('color','red');
// 			$("#userPw").focus();
			return false;
			
		}else if(checkPW.test(userPw)){
			$('#pw_msg').html("사용가능한 비밀번호입니다.")
        	$('#pw_msg').css("color", "#3f8ef7");                           
//         	$("#userPw_chk").focus();
        	return true;
		}
	}) //$('#userPw').blur ed
	
	$('#userPw_chk').blur(function() {
		var userPw = $('#userPw').val();
		var userPwChk = $('#userPw_chk').val();
	
		if(userPw != userPwChk){	
			$('#pwchk_msg').html('비밀번호가 일치하지 않습니다.');
			$('#pwchk_msg').css('color','red');
// 			$("#userPw_chk").focus();
			return false;
		
		}else if(userPw === userPwChk){
			$('#pwchk_msg').html('비밀번호가 일치합니다');
			$('#pwchk_msg').css('color','#3f8ef7');
// 			$("#userName").focus();
			return true;			
		}
	}) //$('#userPw_chk').blur ed
	
	
	$('#userName').blur(function() {
		var userName = $('#userName').val();
	
		if(userName === ''){	
			$('#name_msg').html('이름을 입력해 주세요');
			$('#name_msg').css('color','red');
// 			$("#userName").focus();
			return false;
		}else if(!checkName.test(userName)){
			$('#name_msg').html('옳지않은 형식입니다.');
			$('#name_msg').css('color','red');
// 			$("#userPw").focus();
			return false;
			
		}else if(checkName.test(userName)){  
			$('#name_msg').html('');
 			$('#name_msg').css('color','#3f8ef7');
//         	$("#birth").focus();
        	return true;
		}
	}) //$('#userName').blur ed
	
	$('#phone').blur(function() {
		var phone = $('#phone').val();
	
		if(phone === ''){	
			$('#phoneMsg').html('핸드폰 번호를 입력해주세요');
			$('#phoneMsg').css('color','red');
			return false;
			
		}else if(!checkPhone.test(phone)){
			$('#phoneMsg').html('옳지않은 형식입니다.');
			$('#phoneMsg').css('color','red');
			return false;
			
		}else if(checkPhone.test(phone)){  
			$('#phoneMsg').html('');
 			$('#phoneMsg').css('color','#3f8ef7');
        	return true;
		}
	}) //$('#phone').blur ed
	
	

})//$(document).ready ed