6개월 대장정/JSP 개념

49일차 - [JSP] input types

pitang 2021. 10. 30. 02:54
반응형

안녕하세요. pitang입니다.

JSP의 input types에 대해 알아보겠습니다.

 

input type

HTML input 태그는 아래와 같이 다양한 type 속성들을 가지고 있다.

type 속성의 기본값은 text이다.

  • <input type="button">
  • <input type="checkbox">
  • <input type="color">
  • <input type="date">
  • <input type="datetime-local">
  • <input type="email">
  • <input type="file">
  • <input type="hidden">
  • <input type="image">
  • <input type="month">
  • <input type="number">
  • <input type="password">
  • <input type="radio">
  • <input type="range">
  • <input type="reset">
  • <input type="search">
  • <input type="submit">
  • <input type="tel">
  • <input type="text">
  • <input type="time">
  • <input type="url">
  • <input type="week">

type의 이름들이 보면 유추가 가능할 정도이기에 설명 없이 바로 예시를 보겠다.

 

ex1)

08input.jsp
console

-> 25번 줄에는 0부터 10까지 2씩 올라가는 즉, (0, 2, 4, 6, 8, 10)의 숫자만 선택할 수 있다.


<input type="text"> 은 단일 줄 텍스트 입력 필드를 정의한다. 즉, text를 입력할 수 있다.

ex1)

09input-text.jsp
console


<input type="number> 은 숫자 입력 필드를 정의한다. 

min="" max="" step"" 등으로 허용되는 숫자에 대한 제한도 설정할 수 있다.

ex1)

10input-number.jsp
console


<input type="date">는 날짜를 포함해야 하는 입력 필드에 사용된다.

브라우저 지원에 따라 달력 보기가 입력 필드에 나타날 수도 있다.

ex1)

11input-date.jsp
console


<input type="checkbox"> 은 확인란을 정의한다. 제한된 수의 항목 중 다중 선택이 가능하다.

ex1)

12input-checkbox.jsp
console

 

ex2)

13input-checkbox.jsp
console

 

ex3)

14input-checkbox.jsp
console

 

ex4)

15input-checkbox-getParameterValues.jsp
console

-> 26번째줄 request.getParameterValues("movie") 이름이 movie인 모든 파라미터 값을 배열로 구한다.


<input type="radio"> 는 라디오 버튼을 정의한다. 라디오 버튼은 체크박스와 달리 제한된 수의 항목 중 하나만 선택할 수 있다.

ex1)

16input-radio.jsp
console

 

ex2)

17input-radio.jsp
console

 

ex3)

18input-checkbox-radio-checked.jsp
console

-> checked 속성으로 기본값을 설정해놓을 수도 있다.


<input type="password"> 는 암호 필드를 정의한다. 입력 글자가 보이지 않는 특성을 가진다.

 

ex1)

26input-password.jsp
console

 

 

 

감사합니다.

 

*m1 맥북을 사용 중입니다.*

 

728x90
반응형