<input type
=
"search"
......
>
search 타입을 보게 되면 일반 text 타입과 같습니다. 차이가 없어 보입니다.
그런데 텍스트를 입력하게 되면 오른쪽에 X모양이 나오는 것을 확인하실 수 있습니다.
X표를 누르게 되면 일반 text 타입과 달리 한번에 입력한 값을 지울 수가 있습니다.
따라서 사용자로 하여금 검색을 할 때 좀 더 편리하게 이용할 수 있도록 만든 것입니다.
<input type
=
"url"
......
>
url 타입은 입력을 했을때 웹주소 형식이 아닐 경우를 자동 체크해줍니다.
2번을 보면 그냥 123으로만 입력을 하고 검색 버튼을 누르니 "URL을 입력하세요"라는 메시지가 나오는 것을 확인하실 수 있습니다.
<input type
=
"email"
......
>
email 타입은 @ 문자를 포함한 메일 주소 형식을 자동 체크해줍니다.
이 경우데도 만약 형식이 맞지 않으면 "이메일 주소에 @를 포함해 주세요" 라는 메시지가 표시되는 것을 확인하실 수 있습니다.
<input type
=
"tel"
......
>
tel은 형식을 체크하는 부분이 없습니다.
단지 이 형식으로 넘어온 경우에는 전화번호라고 인식을 하게 되는 것입니다.