개발자의 끄적끄적

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

개발/javascript & jquery

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

효벨 2020. 2. 20. 01:00
728x90
반응형

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

 

정규표현식을 이용한 이메일 유효성 검사
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 = "jang@tjsrms.me";
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>

 

출처 : http://blog.tjsrms.me/%EC%A0%95%EA%B7%9C%ED%91%9C%ED%98%84%EC%8B%9D%EC%9D%84-%EC%9D%B4%EC%9A%A9%ED%95%9C-%EC%9D%B4%EB%A9%94%EC%9D%BC-%EC%9C%A0%ED%9A%A8%EC%84%B1-%EA%B2%80%EC%82%AC-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC/

반응형
Comments