HTML / input / date, time / 날짜, 시간 입력하는 양식

input type="date"

type이 date인 input은 날짜를 입력받기 위한 양식입니다. 웹브라우저마다 표현 방식은 다르고, IE가 지원하지 않는다는 단점이 있지만, 스크립트를 사용하지 않고 날짜 형식만 입력 받을 수 있습니다.

문법

  • value : 선택 항목으로, 기본 날짜를 정합니다.
  • min : 선택 항목으로, 입력 가능한 가장 빠른 날짜입니다.
  • max : 선택 항목으로, 입력 가능한 가장 늦은 날짜입니다.

예제 1

  • 날짜를 입력 받는, 선택 항목이 없는 가장 간단항 양식입니다.

  • Edge라면 다음처럼 나옵니다.

  • 양식을 선택하면 다음처럼 날짜를 선택하도록 합니다.

  • 크롬이라면 다음처럼 나옵니다.

예제 2

  • 2019년 9월 22일을 기본값으로 하는 예제입니다.

예제 3

  • 2019년 9월 10일부터 2019년 9월 25일까지만 입력할 수 있는 양식입니다.

input type="time"

type이 time인 input은 시간을 입력받기 위한 양식입니다.

문법

  • value : 선택 항목으로, 기본 시간을 정합니다.
  • min : 선택 항목으로, 입력 가능한 가장 빠른 시간입니다.
  • max : 선택 항목으로, 입력 가능한 가장 늦은 시간입니다.

예제 1

  • 시간을 입력 받는, 선택 항목이 없는 가장 간단항 양식입니다.

  • Edge라면 다음처럼 나옵니다.

  • 양식을 선택하면 다음처럼 시간을 선택하도록 합니다.

  • 크롬이라면 다음처럼 나옵니다.

예제 2

기본값과 입력 가능한 시간 범위를 정한 예제입니다.