예
세 개의 문자를 (아무 숫자 나 특수 문자) 포함 할 수있는 입력 필드와 HTML 양식 :
<form action="demo_form.asp">
Country code: <input type="text" name="country_code"
pattern="[A-Za-z]{3}"
title="Three letter country code">
<input type="submit">
</form>
»그것을 자신을 시도 자세한 내용은 아래 예 "자신을보십시오."
정의 및 사용
pattern 속성은 정규 표현식 지정 <input> 요소의 값에 대해 확인됩니다.
주 : pattern : 속성은 다음과 같은 입력 형식으로 작동 text, date, search, url, tel, email 및 password .
팁 : 글로벌 사용 title 사용자에게 도움이되는 패턴을 설명하는 속성을.
팁 :에 대해 자세히 알아 정규 표현식 우리의 자바 스크립트 튜토리얼입니다.
브라우저 지원
표의 수치는 완전히 특성을 지원하는 제 브라우저 버전을 지정.
| 속성 | |||||
|---|---|---|---|---|---|
| pattern | 5.0 | 10.0 | 4.0 | 지원되지 않음 | 9.6 |
HTML 4.01과 HTML5의 차이점
pattern 속성은 HTML5의 새로운 기능입니다.
통사론
<input pattern="regexp">
속성 값
| 값 | 기술 |
|---|---|
| regexp | 하는 정규 표현식 지정 <input> 요소의 값에 대해 확인을 |
더 예
예
<input> 와 요소 type="password" 6 개 이상의 문자를 포함해야합니다 :
<form action="demo_form.asp">
Password: <input type="password" name="pw" pattern=".{6,}" title="Six or
more characters">
<input type="submit">
</form>
»그것을 자신을 시도 예
<input> 와 요소 type="password" 적어도 하나의 숫자입니다 8 자 이상, 하나의 대문자와 소문자를 포함해야합니다 :
<form action="demo_form.asp">
Password: <input
type="password" name="pw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain
at least one number and one uppercase and lowercase letter, and at least 8
or more characters">
<input type="submit">
</form>
»그것을 자신을 시도 예
<input> 와 요소 type="email" 다음과 같은 순서로해야합니다 : 문자 @ 문자. @ 기호 뒤에 도메인 (문자는 다음 이상의 문자 다음에, 그리고 "."
애프터 "." 당신은 A에서 Z까지 2 ~ 3 글자를 쓸 수 있습니다 서명 :
<form action="demo_form.asp">
E-mail: <input type="email"
name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$">
<input type="submit">
</form>
»그것을 자신을 시도 예
<input> 와 요소 type="search" 다음 문자를 포함 할 수 없습니다 ' 또는 "
<form action="demo_form.asp">
Search: <input
type="search" name="search" pattern="[^'\x22]+" title="Invalid input">
<input type="submit">
</form>
»그것을 자신을 시도 예
<input> 와 요소 type="url" 로 시작해야합니다 http:// 또는 https:// 적어도 하나의 문자 뒤에 :
<form action="demo_form.asp">
Homepage:
<input type="url" name="website" pattern="https?://.+" title="Include
http://">
<input type="submit">
</form>
»그것을 자신을 시도