8. 유효성 검사

<유효성 검사의 개요>

유효성 검사는 사용자가 폼 페이지에서 입력한 데이터 값이 서버로 전송되기 전에 특정 규칙에 맞게 입력되었는지 검증하는 것을 말한다.

유효성 검사를 위한 핸들러 함수

폼 페이지에서 이벤트가 발생했을 때 (submit을 클릭한 경우) 유효성 검사를 위해 매핑하는 메소드

<script type="text/javascript">
	function 핸들러 함수(){
    	var str = document.폼이름.입력항목 이름.value;
    }
</script>

<form name="폼 이름">
	<input type="submit" onclick="핸들러함수()">
</form>

<기본 유효성 검사>

사용자가 폼 페이지의 입력 항목에 입력한 데이터 값이 있는지 없는지 확인하고 데이터 길이, 숫자 등 기본적인 것이 맞는지 검사.

1. 데이터 유무 확인

document.폼이름.입력양식 이름.value==""

2. 데이터 길이 확인

document.폼이름.입력양식 이름.value.length

3. 숫자 여부 확인

isNaN(document.폼이름.입력양식 이름.value)

<데이터 형식 유효성 검사>

사용자가 폼 페이지의 입력 항목에 입력한 데이터 값이 특정 형태에 적합한지 검사하기 위해 정규 표현식을 사용하는 방법

정규 표현식 사용하기

• 객체 초기화 사용 : 입력된 표현식이 거의 바뀌지 않는 상수형태일 때 주로 사용

var 변수 이름 = /정규 표현식/[Flag];

• RegExp 객체 이용 : 정규표현식이 자주 변경될 때 주로 사용

var 변수 이름 = new RegExp('정규 표현식',['Flag']);

• 정규 표현식의 메소드 종류

메소드	설명
test()	매개변수 값으로 전달되는 문자열이 정규 표현식에 부합한디 판단하여 true/false를 반환
exec()	매개변수 값으로 전달되는 문자열에서 정규 표현식에 부합된 문자열을 추출하여 반환