[HTML5&JavaScript] 정규식

고동이의 IT·2021년 11월 22일
0

HTML5&JavaScript

목록 보기
15/15
post-thumbnail

전방탐색:

  • 탐색문자?=기준점
  • ^로시작하고 $로끝남.
/^탐색문자(?=기준자)$/

공백있으면안됨.

  • 탐색문자 생략시 기준자로 시작하는 문자를 탐색
  • .*
0번이상나오는 문자 .*[A-Z] 영문자 대문자가 포함된다. 탐색문자 생략

. : [기준점]앞에 어떤 문자가 와도되고 안와도되고 근데 [기준점]은 꼭있어야함
ex. passreg = /^(?=.
[A-Z])(?=.[a-z])(?=.[0-9])(?=.[!@#$%^&]).{8-20}$/;

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../css/mystyle.css" type="text/css">
<style type="text/css">
label {
	display : inline-block;
	width:100px;
	height: 40px;

}
input{
	height: 30px;
	margin: 2px;
}

</style>
<script type="text/javascript">
function proc1(){
	
	// 입력한값 가져오기 - value & 공백과 길이 체크
	ff = document.myform;

	 idv = ff.id.value.trim();
	if(idv.length<1){
		alert("id를 입력하세요");
		return false;
	}
	if(idv.length< 8  || idv.length> 20){
		alert("아이디는 8~20자리 입니다.")
		return false;
	}
	
	// 정규식
	idreg = /^[a-z][A-za-z0-9]{7,19}$/;
	
	// 정규식.test(value) - true, false를 리턴한다.
	
	if(!(idreg.test(idv))){
		alert("아이디 형식오류")
		return false;
	}
	
	
	namev = ff.name.value.trim();
	if(namev.length<1){
		alert("name를 입력하세요");
		return false;
	}
	
	if(namev.length< 2  || namev.length> 5){
		alert("이름은 2~5자리 입니다.")
		return false;
	}
	
	// 정규식
	namereg = /[가-힣]{2,5}$/;
		
	if(!(namereg.test(namev))){
		alert("이름 형식오류")
		return false;
	}	
	
	telv = ff.tel.value.trim();
	if(telv.length<1){
		alert("tel를 입력하세요");
		return false;
	}
	
	telreg = /^\d{2,3}\d{3,4}\d{4}$/;
		
	if(!(telreg.test(telv))){
		alert("전화번호 형식오류.")
		return false;
	}	
	
	emailv= ff.email.value.trim();
	if(emailv.length<1){
		alert("email를 입력하세요");
		return false;
	}
	
	emailreg = /^([a-zA-Z0-9]+)@([a-zA-Z0-9]+)(\.[a-z]+){1,2}$/;
		
	if(!(emailreg.test(emailv))){
		alert("이메일 형식오류")
		return false;
	}
	 
	 
    passv = ff.pass.value.trim();
	 
	if(passv.length<1){
		alert("pass를 입력하세요");
		return false;
	}
	
	if(passv.length< 8  || passv.length> 20){
	alert("비밀번호는 8~20자리 입니다.")
	return false;
	
 	   // 전방탐색: 탐색문자?=기준점
	   //  a = "http://www.naver.com"
	  /*   a = "https://www.naver.com" // :를 기준으로 w찾는다
		 b = /\w+(?=:)/
		 bb = a.match(b);
		 alert(bb); 
	  */
	  
		// ^로시작하고 $로끝남. /^탐색문자(?=기준자)$/ 공백있으면안됨.
		// 탐색문자 생략시 기준자로 시작하는 문자를 탐색
		// .* 0번이상나오는 문자 .*[A-Z]
		
		// 영문자 대문자가 포함된다. 탐색문자 생략
		// .* : [기준점]앞에 어떤 문자가 와도되고 안와도되고 근데 [기준점]은 꼭있어야함
		
	 passreg = /^(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*]).{8-20}$/;
		
	if(!(passreg.test(passv))){
		alert("비밀번호 형식오류")
		return false;
	} 	
		
} 
	
	alert("성공");


}

</script>
</head>
<body>

<div class="box">
	
	<form name="myform">
		<label>아이디</label>
		<input type="text" id="id" name="id"><br>
		<label>이름</label>
		<input type="text" id="name" name="name"><br>
		<label>비밀번호</label>
		<input type="password" id="pass" name="pass"><br>
		<label>전화번호</label>
		<input type="text" id="tel" name="tel"><br>
		<label>이메일</label>
		<input type="text" id="email" name="email"><br>
	</form>
	
	<br>
	<button type="button" onclick="proc1()">확인</button>
	<div id="result1"></div>
</div>


</body>
</html>
profile
삐약..뺙뺙

0개의 댓글