정규표현식을 이용한 이메일 유효성 검사 (자바스크립트)

정규표현식을 이용한 이메일 유효성 검사

Javascript 에서 정규표현식을 이용하여 E-mail 유효성을 검사합니다.

email_check라는 이름의 함수를 만들어보았습니다.

<script>
// 정규표현식을 정의합니다.
function email_check( email ) {
    
    var regex=/([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
    return (email != '' && email != 'undefined' && regex.test(email));

}
</script>

정규표현식 검사를 통과하면 true를 리턴합니다.

 

이 함수를 이용하여 간단하게 이메일 주소를 검사하여 유효성 검사 통과여부를 검사하는

자바스크립트를 작성해보았습니다.

<script>
// 검사할 E-mail 주소를 변수로 선언합니다.
var email = "[email protected]";
if ( ! email_check(email) ) {
    console.log("not email address");
}
</script>

 

조금 더 응용하여 jquery를 이용하여

input box에서 포커스를 잃었을때 e-mail 주소 유효성 검사를 하는 코드입니다.

<script>
$(document).ready(function) {

    // name 속성이 'email'인 input 이 focus를 잃었을때 처리한다.
    $("input[name='email']").blur(function(){

        var email = $(this).val();

        // 값을 입력안한경우는 아예 체크를 하지 않는다.
        if( email == '' || email == 'undefined') return;

        // 이메일 유효성 검사
        if(! email_check(email) ) {
            alert('잘못된 형식의 이메일 주소입니다.');
            $(this).focus();
            return false;
        }
    });

});
</script>

 

활용 데모는 아래에서 확인하실수 있습니다.