RATSENO

[JS/jQuery]다양한 입력값 체크 본문

DEV/JS

[JS/jQuery]다양한 입력값 체크

RATSENO 2020. 2. 7. 16:42

웹사이트에서 회원가입 등 여러가지 입력 항목에는

다양한 입력제한 들이 적용되어 있습니다.

간단한 예제들을 통해 주로 사용되는 입력값 체크 방법에 대해서  알아보겠습니다.

#아이디를 숫자만 입력했을 경우

<script>
var id = "1111111111";
if(Number(id)){
    alert("아이디는 숫자만 사용할 수 없습니다.");
}
</script>

#아이디가 영문으로 시작하지 않을 경우

<script>
var id = "1test";
if(!/^[a-zA-Z]/.test(id)){
    alert("아이디는 영문으로 시작해야 합니다.");
}
</script>

#아이디 안에 한글이 포함되어있을 경우

var id = "test테스트";
if(/[ㄱ-ㅎ|ㅏ-ㅣ|가-힝]/.test(id)){
    alert("아이디 안에 한글은 포함될 수 없습니다.");
}

#비밀번호안에 같은문자가 4번 이상 포함되어있을 경우

var pwd = "1111테스트";
if(/(\w)\1\1\1/.test(pwd)){
    alert('비밀번호안에 같은문자는 4번 이상 사용할 수 없습니다.');
}

#비밀번호안에 연속된 숫자가 4회 이상 포함되어 있을 경우

<script>
var pwd = "0123";
    //연속된숫자
if(/(0123)|(1234)|(2345)|(3456)|(4567)|(5678)|(6789)|(7890)/.test(pwd)){// 연속된 숫자 정규식
    alert('비밀번호는 4회이상의 연속된 숫자를 사용할 수 없습니다.');
}

//연속된숫자
if(/(0987)|(9876)|(8765)|(7654)|(6543)|(5432)|(4321)|(3210)/.test(pwd)){// 연속된 숫자 정규식
    alert('비밀번호는 4회이상의 연속된 숫자를 사용할 수 없습니다.');
}
</script>

#비밀번호가 영문 대/소문자, 숫자, 특수문자 중 3개이상의 조합이 아닐 경우

<script>
var pwd = "ratseno999"
var checkCount = 0;

if(/[0-9]/.test(pwd)){ //숫자
    checkCount++;
}
var pwChkCnt2 = 0;
if(/[A-Z]/.test(pwd)){ //대문자
    checkCount++;
}
var pwChkCnt3 = 0;
if(/[~!@\#$%<>^&*\()\-=+_\’]/.test(pwd)){ //특수문자
    checkCount++;
}
if(/[a-z]/.test(pwd)){ //소문자
    checkCount++;
}

console.log("조합 수 :", checkCount);
if(checkCount <= 2){
    alert('비밀번호는 영문 대/소문자, 숫자, 특수문자 중 3개이상의 조합이여야만 합니다.');
}
</script>

#휴대폰 번호 양식 체크

<script>
var phoneNumber = "010-1111-222g";
if(!/01[01689]-[1-9]{1}[0-9]{2,3}-[0-9]{4}$/.test(phoneNumber)){
    alert("휴대폰 번호 양식이 아닙니다.");
}

var phoneNumber = "0101111222g";
if(!/01[01689][1-9]{1}[0-9]{2,3}[0-9]{4}$/.test(phoneNumber)){
    alert("휴대폰 번호 양식이 아닙니다.");
}
</script>

#이메일 양식 체크

<script>
var email = "ttttgamil.com";
if(!/^[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/i.test(email)){
    alert("이메일 양식이 아닙니다.");
}
</scirpt>

'DEV > JS' 카테고리의 다른 글

두개의json array 병합하기  (0) 2021.03.04
json array에서 중복된 객체 제거하기  (0) 2021.02.27
[JS/jQuery]$(document).ready(function(){});이란?  (1) 2020.02.06
[JS]맵(Map)과 셋(Set) -2  (0) 2019.12.04
[JS]맵(Map)과 셋(Set) -1  (0) 2019.12.04
Comments