어제 오늘 내일

select 태그를 사용한 콤보박스에서 선택한 값과 텍스트를 출력하는 방법을 소개합니다. 1. 콤보박스(select)에서 선택한 값 출력하기 2. 콤보박스(select)에서 선택한 텍스트 출력하기 3. 중복선택 된(multiple) 값과 텍스트 출력하기 먼저 select 태그를 이용하여 콤보박스를 만드는 방법은 아래 링크의 이전 포스팅을 참조하세요. [HTML] 콤보박스(select) (1) - 기본값 지정, 비활성화, 항목 비활성화 [HTML] 콤보박스(select) (2) - 사이즈 지정, 중복선택, 카테고리 설정 1. 콤보박스(select)에서 선택한 값 출력하기 한국어 영어 중국어 스페인어 function handleOnChange(e) { // 선택된 데이터 가져오기 const value = e..

지난 번에는 콤보박스(select)를 활용하는 기본적인 방법들을 알아보았습니다. [HTML] 콤보박스(select) (1) - 기본값 지정, 비활성화, 항목 비활성화 이번에는 콤보박스의 사이즈를 지정하는 법, 중복 선택이 가능하도록 설정하는 법, 카테고리를 설정하는 법을 알아보도록 하겠습니다. 콤보박스의 사이즈 늘리기 See the Pen select by anna (@hianna) on CodePen. 위와 같이 태그에 'size' 속성을 지정해 주면 드롭다운 목록이 아닌, 선택 목록이 지정된 크기만큼 보여지게 됩니다. 선택 항목의 갯수보다 size가 작으면 자동으로 스크롤이 생성됩니다. 콤보박스 중복 선택 설정하기 See the Pen select by anna (@hianna) on CodePen...

사용자로부터 선택 입력을 받을 수 있는 콤보박스(드롭다운 박스)를 만드는 방법을 알아보도록 하겠습니다. 기본 콤보박스 만들기 See the Pen select by anna (@hianna) on CodePen. HTML에서 콤보박스를 만들기 위해서는 , 을 사용합니다. 태그 안에 태그를 포함시키고, 선택할 값들을 태그 안에 지정해 줍니다. 기본값(default) 지정 See the Pen select by anna (@hianna) on CodePen. 기본값을 지정하지 않으면 가장 위에 있는 값이 기본으로 선택됩니다. 특정한 값 하나를 기본값(default)으로 지정하고 싶으면, 위와 같이 기본으로 지정하고 싶은 값의 태그에 'selected'라고 지정해주면, 해당 항목이 기본값으로 지정이 되고, 화..