<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>유효성 검사</title>
</head>
<body>
<input type="text" id="in1">
<button onclick="check()">검증</button>
<h3 id="aa"></h3>
<script>
function check(){
//검증용 정규표현식
var regExp = /^[a-zA-Z]+$/ //영문자 한개 이상 +
var e = document.getElementById('in1');
//입력된 글씨
var s = e.value;
//검증 2가지 방법
//1. String .match() 메소드
// if(s.match(regExp)) alert("OK");
// else alert("요구하는 형식이 아닙니다");
//2. RegExp 객체의 text()메소드
// if(regExp.test(s)) alert("OK");
// else alert("요구하는 형식이 아닙니다");
//정규표현식 연습
regExp= /a/; //a라는 문자가 포함된 모든 입력 ok
regExp= /A/; //A라는 문자가 포함된 모든 입력 ok - 대소 구별됨
regExp= /ab/; //붙어 있는 ab가 있어야 통과
regExp= /^a/; //시작이 무조건 a여야 통과
regExp= /^[a-z]/; //시작이 무조건 영어 소문자
regExp= /a$/; //끝이 무조건 a여야 통과
regExp= /ab$/; //끝이 무조건 ab여야 통과
regExp= /^a$/; //딱 a 한글자만 쓸 수 있다는 뜻
regExp= /^ab$/; //딱 ab 두글자만 쓸 수 있다는 뜻
regExp= /^[a-z]$/; //영어 소문자 중 한들자만 쓸 수 있다
regExp= /^[a-zA-Z]$/; //영문자 중 하나만 쓸 수 있음
regExp= /^[a-zA-Z0-9]$/; //영문자 or 숫자 중 하나만 쓸 수 있음
regExp= /^[a-z]{2}$/; //영문자 소문자 2자 가능
regExp= /^[a-z]{2,4}$/; //영문자 소문자 2~4자만 가능
regExp= /^[a-z]{4,}$/; //영문자 소문자 4자 이상 써라
regExp= /^\w{4,}$/; // \w : 문자 숫자 모두 다 라는 뜻 , 4자 이상 써
regExp= /^[a-z]*$/; //영문자 소문자 0개 이상 써라(안써도 ok)
regExp= /^[a-z]+$/; //영문자 소문자 1개 이상 써라
regExp= /^[a-z]?$/; //영문자 소문자 1개 또는 0개
regExp= /^[5-9]$/; //숫자 5~9중에 한개
regExp= /^\d$/; //숫자 한개
regExp= /^\d\d\d$/; //숫자 세개
regExp= /^\d\d\da\d\d\da\d\d\d$/; //숫자 3개 a 숫자 3개 a 숫자 3개 (패턴 지정)
//생년월일 형식 검증 ####-##-##
regExp= /^\d\d\d\d-\d\d-\d\d$/;
regExp= /^[0-9]{4}-[0-9]{2}-[0-9]{2}$/;
//이메일 형식 ####@###.##
regExp= /^[a-zA-Z0-9!$%^&]+@[a-zA-Z]+.[a-z]*$/;
//URL 주소가 맞는지 확인
regExp= /^http:/
//혹시 '/' 한개를 검증
regExp= /^\/$/ //역슬래시 필요
var h = document.getElementById('aa');
if(regExp.test(s)) h.innerHTML = "OK";
else h.innerHTML = "요구하는 형식이 아닙니다";
}
</script>
</body>
</html>