input 태그
HTML5에서 추가된 input 요소의 타입 HTML5에서 새롭게 추가된 input 요소의 타입은 다음과 같습니다.
- 숫자 입력(number)
- 입력 범위 지정(range)
- 색상 입력(color)
- 날짜 입력(date)
- 시간 입력(time)
- 날짜와 시간 입력(datetime-local)
- 연도와 월 입력(month)
- 연도와 주 입력(week)
- 이메일 입력(email)
- URL 주소 입력(url)
- 전화번호 입력(tel)
- 검색어 입력(search)
예전에 자바스크립트로 직접 소스를 만들었지만
요즘엔 html5가 지원하는 날짜입력, 전화번호입력 검사해주는
input 태그가 생겼다. 적용해보자
required : 필수입력상황을 체크해준다.
(전화번호) 정규표현식
1
<input type="tel" name="telNo" required pattern="[0-9]{3}-[0-9]{4}-[0-9]{4}" title="###-####-####">
0~9까지 3개 , 0~9까지 4개, 0~9까지 4가지있는가
라디오버튼
1
2
<input type="radio" name="gender" value="M">
<input type="radio" name="gender" value="F">
- 남자
- 여자
- value값이 넘어간다. name:gender라는 이름으로
버튼
1
2
<input type="submit" name="Send"> <!-- submit버튼 -->
<input type="reset" name="Reset"> <!-- reset버튼 -->
submit : 필수입력사항이 맞는지체크하고, 최종적으로 action에있는 서버프로그램을 호출한다.
- reset : 페이지를 초기화시켜쥰다.
경로
1
<form action="../../0524/html/sample.html" method="get">