[HTML5] Input pattern으로 유효성 검사하기

HTML5 <Input>태그 pattern 정규 표현식 모음

---

1. 숫자만(공백x)

<input type="text" name="patternValue" pattern="^[0-9]+$">

 

2. 대소문자

<input type="text" name="patternValue" pattern="^[a-zA-Z]+$">

 

3. 소문자

<input type="text" name="patternValue" pattern="^[a-z]+$">

 

4. 대소문자 or 숫자

<input type="text" name="patternValue" pattern="^[a-zA-Z0-9]+$">

 

5. 소문자 or 숫자 

<input type="text" name="patternValue" pattern="^[a-z0-9]+$">

 

6. 소문자 && 숫자 && 8~16자리 숫자 (아이디 유효성검사)

<input type="text" name="patternValue" pattern="^(?=.*[a-z])(?=.*\d)[A-Za-z\d]{8,16}$">

 

7. 소문자 && 숫자 && 특수문자 && 8~16자리 숫자 (패스워드 유효성검사)

<input type="text" name="patternValue" pattern="^(?=.*[a-z])(?=.*\d)(?=.*[$@$!%*#?&])[a-z\d$@$!%*#?&]{8,16}$">

 

8. 대소문자 && 숫자 && 특수문자 && 8~16자리 숫자 (패스워드 유효성검사)

<input type="text" name="patternValue" pattern="^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8,16}$">